当前位置:首页 > 开发 > 编程语言 > 编程 > 正文

事件委派笔记1

发表于: 2014-01-10   作者:alleni123   来源:转载   浏览:
摘要: <!DOCTYPE html> <html> <head> <title>left.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> &
<!DOCTYPE html>
<html>
  <head>
    <title>left.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    
	<script type="text/javascript" src="C:\Users\Administrator\Desktop\jquery-1.9.0.js"></script>
	<style type="text/css">
		*{
			margin:0;
			padding:0;
		}
	</style>
	
	<script type="text/javascript">
		$(function(){
		 	console.log($("#div1"));
		 	
			
			$("p").click(function(){
				alert("clicked");
			});
			
			$("#div1").on("click","p",function(){alert("on clicked");});
			
			$("div").append("<p>hello</p>");
			
		});
		
	</script>
	
  </head>
  
  <body>
  	 <div id="div1"></div>
	
	 

  </body>
</html>


这里在代码的最后的地方加入了<p>hello</p>

上面的例子中,
$("p").click的函数是无法被执行的。
而$("#div1").on("click","p",function(){});
这里是可以执行的。

也就是说 on()这个函数可以将事件处理绑定到现在已经存在的, 包括将来会被添加进去的节点中去。

事件委派笔记1

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号