jquery <table>中<tr>和<td>哪位高手引发事件
日期：2014-05-16 浏览次数：20366 次
jquery <table>中<tr>和<td>谁引发事件？
<table>
<tr><td>1</td><td>name1</td></tr>
<tr><td>2</td><td>name2</td></tr>
<tr><td>3</td><td>name3</td></tr>
</table>
table{ border-collapse:collapse}
从一行移入另一行的事件
$("tr").mouseenter( function(e){});
e.target为什么是td,而不是tr，难道td的mouseenter事件冒泡到tr，但是mouseenter事件不会冒泡。
------解决方案--------------------
可能因为你的tr区域完全被td填充，所以e.target是td
------解决方案--------------------
不应该吧，target是非IE浏览器下的事件属性，srcElement是IE下的事件，非IE的浏览器之下是默认执行的捕获事件，当然mouseenter这个应该对兼容已经处理了，你可以看下mouseenter函数的源代码，用封装好的框架，不好说是什么样的事件流~~
------解决方案--------------------
你将tr的高度设为200px,td的高度设为100px再看看？
------解决方案--------------------
是一样的。可能是由于tr一定会被td填充。所以这种方法测试没用
你在某个td中加入个div就知道了。你可以得到e.target=div的提示
table这种方法不好测试,用div粗糙的做个小例子，你可以看到从外到内的层级，移动时从外围的div,ul,li的顺序都可以得到，由此可知，这种事件应该不会冒泡
<table>
<tr><td>1</td><td>name1</td></tr>
<tr><td>2</td><td>name2</td></tr>
<tr><td>3</td><td>name3</td></tr>
</table>
table{ border-collapse:collapse}
从一行移入另一行的事件
$("tr").mouseenter( function(e){});
e.target为什么是td,而不是tr，难道td的mouseenter事件冒泡到tr，但是mouseenter事件不会冒泡。
------解决方案--------------------
可能因为你的tr区域完全被td填充，所以e.target是td
------解决方案--------------------
不应该吧，target是非IE浏览器下的事件属性，srcElement是IE下的事件，非IE的浏览器之下是默认执行的捕获事件，当然mouseenter这个应该对兼容已经处理了，你可以看下mouseenter函数的源代码，用封装好的框架，不好说是什么样的事件流~~
------解决方案--------------------
你将tr的高度设为200px,td的高度设为100px再看看？
------解决方案--------------------
是一样的。可能是由于tr一定会被td填充。所以这种方法测试没用
你在某个td中加入个div就知道了。你可以得到e.target=div的提示
table这种方法不好测试,用div粗糙的做个小例子，你可以看到从外到内的层级，移动时从外围的div,ul,li的顺序都可以得到，由此可知，这种事件应该不会冒泡
- HTML code
<script>
$(".test").mouseover( function(e){
alert(e.target.nodeName)
});
})
</script>
<style type="text/css">
.test{float:left;width:500px;height:300px;border:1px solid #bfbfbf;}
.test ul{ list-style:none; float:left;width:200px;height:150px;border:1px solid #bfbfbf;}
.test ul li{ list-style:none;width:100px;height:80px;border:1px solid #ff9900;margin:30px;}
</style>
<div class="test">
<ul>
<li>asdfasfd</li>
</ul>
</div>
------解决方案--------------------
如果把一个tr中的td全部去掉，只是写一些东西在tr里面，那么alert(e.target.nodeName)，这句话弹出的为空，这个是什么情况？难道tr不算是一个HTML元素，不可能吧，期待大神的解释~~~
------解决方案--------------------
建议楼主去看看这篇文章http://nuysoft.iteye.com/blog/1198058看完你就懂了
------解决方案--------------------
呵呵，你要是在给tr绑定事件以外，再单独给td绑定个同样的事件，但return false，估计就不会了
比如：
- JScript code
$("table tr td").mouseover( function(e){
return false;
});
------解决方案--------------------
只是jquery的事件而已
mouseenter将只在进入的第一次生效，不像onmouseover一样，移来移去的还能触发
------解决方案--------------------
用onMouseEnter、onMouseLeave来代替onMouseOver、onMouseOut，他们的作用基本相同，前者不会发生冒泡。
------解决方案--------------------
看看这篇啊有帮助
http://techbbs.zol.com.cn/1/9_1913.html###
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
