jQuery简单的点击容器内元素与容器外判断

广告位招租
扫码页面底部二维码联系

点击容器内的元素会响应事件(显示某个元素转载请注明出处:www.tangshuang.net【转载请注明来源】),点击容器外则响应另外一个事件(隐藏某著作权归作者所有,禁止商业用途转载。本文作者:唐霜,转载请注明出处。个元素),那么如何断定点击的某个元素为容【版权所有,侵权必究】【未经授权禁止转载】器外元素呢?这个问题看上去好简单,实际上未经授权,禁止复制转载。【版权所有】唐霜 www.tangshuang.net很难。

【本文受版权保护】【关注微信公众号:wwwtangshuangnet】原创内容,盗版必究。转载请注明出处:www.tangshuang.net

例如我们有下面的一串html代码:本文版权归作者所有,未经授权不得转载。

本文作者:唐霜,转载请注明出处。【版权所有,侵权必究】【本文首发于唐霜的博客】【关注微信公众号:wwwtangshuangnet】【作者:唐霜】
<div id="root">
  <div id="parent">
    <div id="child"></div>
  </div>
</div>

上面的代码中,我们点击#child则显示原创内容,盗版必究。【作者:唐霜】某元素,点击非#child则隐藏该元素,转载请注明出处:www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】可是当我们如何绑定,都会遇到点击#chi转载请注明出处:www.tangshuang.net【版权所有】唐霜 www.tangshuang.netld,会激活#root或#parent的【作者:唐霜】【作者:唐霜】绑定事件,而且我们常常通过直接绑定doc本文版权归作者所有,未经授权不得转载。【原创不易,请尊重版权】ument的点击事件来实现该功能,实际上本文版权归作者所有,未经授权不得转载。本文作者:唐霜,转载请注明出处。点击#child的同时也是点击docum【原创不易,请尊重版权】【作者:唐霜】ent,最后的结果是无论你点击#chil【本文首发于唐霜的博客】本文版权归作者所有,未经授权不得转载。d与否,都隐藏该元素,从肉眼感觉就像什么【转载请注明来源】【原创内容,转载请注明出处】也没有发生一样。那么究竟应该如何避免点击本文作者:唐霜,转载请注明出处。【原创不易,请尊重版权】#child时容器外事件被触发呢?如下代未经授权,禁止复制转载。原创内容,盗版必究。码即可解决。

【版权所有,侵权必究】【本文受版权保护】未经授权,禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】
var _itemClick = false;

$(document).on('click', function() {
  if(!_itemClick) $('#att-info').html('');
});

$('#list .item,#att-info').on('click',function() {
  _itemClick = true;
  setTimeout(function() {
    _itemClick = false;
  },100);
});

2015-08-23 4827

为价值买单,打赏一杯咖啡

本文价值48.27RMB