请教一个事件绑定的疑难问题

skyaspnet 2010-06-24 02:11:23

请教是否可以实现如下效果：

　



   <ul>

    <li></li>

    .....若干个li

    <li></li>

   </ul>

在所有的子元素li上绑定click事件？

传统的做法，遍历进行绑定，那么大侠们，有没有办法实现如下效果：

只在ul上绑定click事件就能实现所有的子元素li也绑定click事件？

这是一道面试题，请教各位大侠，谢谢！

...全文

74 12 打赏收藏转发到动态举报

写回复

用AI写文章

12 条回复

切换为时间正序

请发表友善的回复…

发表回复

wqkjj 2010-06-27

打赏
举报

[Quote=引用 8 楼 skyaspnet 的回复:]
引用 7 楼 wqkjj 的回复:
引用 5 楼 skyaspnet 的回复:
请教以上的方法会复制一个函数的副本吗？谢谢！

JS对于函数类型的变量，都是引用类型的，因此不会复制一个副本，而是创建一个指向该函数的指针。
JS下只有undefined、nulll、Number、 String、boolean是基本类型，这些类型的变量在赋值语句中才会创建副本。

类似于
id……
[/Quote]

不是。只是副本。通过函数名称找到函数在内存中对象，然后将该对象的指针赋值给id.onclick

当然，也不绝对。比如，LZ自己修改JS引擎，做一个复制而不是引用，那另当别论

yliu0 2010-06-27

打赏
举报

不会生成一个函数副本. 函数也是一个对象。

skyaspnet 2010-06-27

打赏
举报

PS: 会生成一个函数副本吗？还是说只是通过监控事件来进行操作？谢谢！

skyaspnet 2010-06-27

打赏
举报

[Quote=引用 4 楼 yliu0 的回复:]
绑定到<ul>也可以。利用事件向上冒泡。
HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>bubble event</title>
<script src="../../../lib/jqu……
[/Quote]

非常感谢，这个会生成一个副本吗？

skyaspnet 2010-06-26

打赏
举报

[Quote=引用 7 楼 wqkjj 的回复:]
引用 5 楼 skyaspnet 的回复:
请教以上的方法会复制一个函数的副本吗？谢谢！

JS对于函数类型的变量，都是引用类型的，因此不会复制一个副本，而是创建一个指向该函数的指针。
JS下只有undefined、nulll、Number、 String、boolean是基本类型，这些类型的变量在赋值语句中才会创建副本。
[/Quote]

类似于
id.onclick=函数名称
的写法是复制了一个副本

wqkjj 2010-06-25

打赏
举报

[Quote=引用 5 楼 skyaspnet 的回复:]
请教以上的方法会复制一个函数的副本吗？谢谢！
[/Quote]

JS对于函数类型的变量，都是引用类型的，因此不会复制一个副本，而是创建一个指向该函数的指针。
JS下只有undefined、nulll、Number、 String、boolean是基本类型，这些类型的变量在赋值语句中才会创建副本。

skyaspnet 2010-06-25

打赏
举报

再顶一下

yliu0 2010-06-24

打赏
举报

绑定到<ul>也可以。利用事件向上冒泡。



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>bubble event</title>

<script src="../../../lib/jquery/jquery-1.4.2.js"></script>



<script>

    $(document).ready(function(){

       $("ul").click(function(evt){

            if (evt.target.nodeName == "LI") {

                alert('clicked on li element:' + evt.target.innerHTML);

            }

       })

    });

</script>

</head>

<body>

    <div id="content">

        <ul>

            <li>beijing</li>

            <li>shanghai</li>

            <li>dalian</li>

            <li>shenyang</li>

            <li>shenzhen</li>

        </ul>

    </div>

</body>

</html>

heihei0923 2010-06-24

打赏
举报



var ul1 = document.getElementById('ul1');

	ul1.onclick = function(e){

	   var e = e||window.event;

	   var target =e.srcElement||e.target;

	   if(target.tagName.toLowerCase()=='li'){

	        alert(target.innerHTML);

	   }

	}

碧海情天-赵亮 2010-06-24

打赏
举报

用jquery的具体方法：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<script>

 $(document).ready(function() {

   $('li').click(function(){

		你要干什么就写这吧;

	}); 

});

</script>