关于 js jquery 的事件绑定,事件委托 小提问

[keatkeat1987]

初学 js , 一直用jquery 来绑定事件，但是却一直搞不清楚 jQuery 事件绑定的逻辑
$("table").on("click","tr",function(){
alert("");
});
$("table").on("click","td",function(){
alert("");
});

想问问，以上2个绑定事件，是否会对table绑定2个 event ? 还是一次？

那么如果只用 js 的写法的话 ，我想在2个父子元素上绑定事件(这2个元素是在绑定后才出现的)
我该怎么写 ?
我这里有个想法却不知道正确不？
这里举个题目是 要为 tr 和 td 绑定事件

我在table 绑定事件触发，然后通过 e.target 获取target elem 然后查看TD事件(假如有注册方法)，然后
elem = elem.parentNode 去上一节点再查看TR事件，一直到table 结束 . 这样是正确的方式吗？

[zhjdg]

绑一次；

var c = {
			f1 : function(){
				var selector = 'tr';
				if(s == 'tr'){
					alert('ddd');
				}
			},
			f2 : function() {
				var selector = 'td';
				if(s == 'td'){
					alert('dd');
				}
			}
	}
	
	function fnClick() {
		var eData = [c.f1,c.f2];
		var len = eData.length;
		for(var i=0;i<len;i++){
			eData[i].call(c);
		}
	}
	
	document.getElementById('table').onclick = fnClick;

[天际的海浪]

Q：想问问，以上2个绑定事件，是否会对table绑定2个 event ? 还是一次？ A：是的，对table绑定了2个事件，2个事件同时有效 Q：我在table 绑定事件触发，然后通过 e.target 获取target elem 然后查看TD事件(假如有注册方法)，然后 elem = elem.parentNode 去上一节点再查看TR事件，一直到table 结束 . 这样是正确的方式吗？ A：基本上就是这样，你可以去看看jquery的源代码，看看jquery是怎么实现事件委托的

[zhjdg]

我想问问什么叫event. 有那2个event.

[whatisma]

引用 6 楼 u011461314 的回复:

我想问问什么叫event. 有那2个event.

你不知道同一对象上可以绑定多个click事件吗？

[爱跳舞的铅笔头]

当然是绑定两个event,一个是给tr绑定，一个是给td绑定的，不冲突。

[zhjdg]

我说楼上的，不会就别害人。 人家函数函数都放在数组里面的。 对同一对象那有2个click事件同时存在。

[W-Aires]

1、绑定一次，但由于tr包含td，所以实际情况下会依次执行td--->tr，除非你在td事件里面阻止冒泡； 2、默认事件是有冒泡的，所以你不需要手动去parentNode，如果没有阻止，会自动触发父节点事件的

[keatkeat1987]

引用 5 楼 jslang 的回复:

Q：想问问，以上2个绑定事件，是否会对table绑定2个 event ? 还是一次？ A：是的，对table绑定了2个事件，2个事件同时有效 Q：我在table 绑定事件触发，然后通过 e.target 获取target elem 然后查看TD事件(假如有注册方法)，然后 elem = elem.parentNode 去上一节点再查看TR事件，一直到table 结束 . 这样是正确的方式吗？ A：基本上就是这样，你可以去看看jquery的源代码，看看jquery是怎么实现事件委托的

感谢回复 只是我基础不好，看不明白jQuery 源码，所以来这儿请教. 假设我在 table 上绑定了 TD 委托事件

      var table = document.getElementById("table");
            var event_td = function (e) {
                var e = e || window.event;
                var elem = e.target || e.srcElement;
                if (elem.nodeName === "TD")
                {
                    alert("TD");
                }
            }
            table.addEventListener('click', event_td, false);

那如果我想在加一个 TR 委托事件的话，我该怎么写呢？

[ILOVE_ASPNET]

引用 8 楼 keatkeat87 的回复:

[quote=引用 5 楼 jslang 的回复:] Q：想问问，以上2个绑定事件，是否会对table绑定2个 event ? 还是一次？ A：是的，对table绑定了2个事件，2个事件同时有效 Q：我在table 绑定事件触发，然后通过 e.target 获取target elem 然后查看TD事件(假如有注册方法)，然后 elem = elem.parentNode 去上一节点再查看TR事件，一直到table 结束 . 这样是正确的方式吗？ A：基本上就是这样，你可以去看看jquery的源代码，看看jquery是怎么实现事件委托的

感谢回复 只是我基础不好，看不明白jQuery 源码，所以来这儿请教. 假设我在 table 上绑定了 TD 委托事件

      var table = document.getElementById("table");
            var event_td = function (e) {
                var e = e || window.event;
                var elem = e.target || e.srcElement;
                if (elem.nodeName === "TD")
                {
                    alert("TD");
                }
            }
            table.addEventListener('click', event_td, false);

那如果我想在加一个 TR 委托事件的话，我该怎么写呢？ [/quote] 看你贴的代码想法是对的啊，给TABLE绑定事件是最好的方式，你判断当前点击的是不是TR就可以做你想做的事情了，还要加一个TR委托事件是什么意思？

[keatkeat1987]

引用 11 楼 u011461314 的回复:

我都说了绑一次。 哎，竟然没看我2楼的代码。

我有看见你的回复，也知道是绑一次了。谢谢

[zhjdg]

不会看jQuery,看看jQuery event的祖宗怎么写。 http://dean.edwards.name/my/events.js http://dean.edwards.name/weblog/2005/10/add-event/

[zhjdg]

原来这addEventListener已经有那功能的， 我还以为一定要模拟。

[keatkeat1987]

看你贴的代码想法是对的啊，给TABLE绑定事件是最好的方式，你判断当前点击的是不是TR就可以做你想做的事情了，还要加一个TR委托事件是什么意思？[/quote] 简单说我想让点击 td 时 alert("td"); 点击 tr 时 alert("tr") .当然点击td 时自然同时也点击到了 tr 所以2个alert 都会出现，但是因为我把事件绑定在 table 上了，所以不管点击 td 还是 tr , 它都只响应了一次table事件 。 所以我想知道是不是用 e.target 获取点击的 elem 然后在模拟向上冒泡那样，去找父节点然后判断 table 是否也绑定了对tr 的事件，然后执行事件 .. 因为我看不懂 jquery 源码又想了解他的逻辑运作，所以就来问问了

[zhjdg]

我都说了绑一次。 哎，竟然没看我2楼的代码。