代码之家 › 专栏 › 技术社区 › Arfa

jquery单击容器,但免除包装的元素

jquery-isotope jquery

Arfa · 技术社区 · 11 年前

我使用的是jquery同位素,有一个元素div,其中包含另一个div。这些是瓦片,其中有很多。

<div class=element > blah blah
<div class=setStamp>load X text</div>
blah blah blah blah
</div>
<div class=element > blah blah
<div class=setStamp>load Y text</div>
blah blah blah blah
</div>

all.元素上有一个点击触发器,用于切换类“large” 我希望能够单击setStamp而不触发切换。到目前为止,我最好的方法是双击。

$container.delegate( '.element', 'dblclick', function(){ // enlarge clicked element
$(this).toggleClass('large');
$container.isotope('reLayout');
});

但我想保持一个简单的点击。我正在试验。not(),并且一般看起来。有什么建议吗?

1 回复 | 直到 11 年前

Roko C. Buljan 11 年前

$container.on('click', '.element', function(){ // enlarge clicked element

   $(this).toggleClass('large');
   $container.isotope('reLayout');

}).on('click', '.setStamp', function( e ){

   e.stopPropagation();

});

DEMO

或者也喜欢:

$container.on('click', '.element', function( e ){ // enlarge clicked element

   if(e.target.className=='setStamp') return;

   $(this).toggleClass('large');
   $container.isotope('reLayout');

});

DEMO

推荐文章

Shaun Taylor · 同位素JS库-卡重叠

7 年前

J.Pillonin · 如何将fancybox与filterizr一起使用,以便图像库中仅显示过滤的项目?

7 年前

vishnu · 同位素垂直标签需要在加载时显示第一项

7 年前

Ebenizer Pinedo · 流星同位素不适用于嵌套模板

7 年前

Kareem Kamal · 如何垂直堆叠图像[复制]

7 年前

Nathe · 同位素-组合按钮和UI滑块不工作

9 年前

Mohamed Rihan · 同位素过滤器复选框和收音机

9 年前

pixeloco · 用同位素单击展开元素

10 年前

dingo_d · 联接多个数组,并仅返回唯一元素jQuery

10 年前

Dan Whiteside · Woocommerce的同位素(负载滞后)

10 年前