首页 > 代码库 > jq实现事件委托

jq实现事件委托

<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no,width=device-width,height=device-height"> <meta charset="UTF-8"> <meta name="Author" content="haley"> <meta name="Keywords" content=""> <meta name="Description" content=""> <script src="http://192.168.1.202/1_exer/0_resources/jq/jquery-1.11.3.js"></script> 事件委托 <style> ul,li{ padding:0;margin:0;list-style: none!important; } menu>ul>li{ float: left; width: 120px; height:30px; line-height: 30px; text-align:center; background: #46b8da; margin:1px; cursor: pointer;color:#fff; } menu>ul li a{ color:#fff; text-decoration: none!important;; } menu>ul li:hover,menu>ul li.active{ background: #0697DA; } menu>ul>li:not(:last-child){ border-right:1px solid silver; } </style><body>
  • 首 页
  • 产品展示
  • 公司简介
  • 关于我们
  • 联系我们
<script> var par=$(‘menu>ul‘); //将事件绑定到父级元素上 par.click(function(event){ console.log(event.target); //判断,如果点击的是li,直接操作li var tar=$(event.target); if(tar.is(‘li‘)){ tar.addClass(‘active‘).siblings().removeClass(‘active‘); window.location.href=http://www.mamicode.com/tar.children().attr(‘href‘);>

jq实现事件委托