在选择器中添加多个元素如何仅 .load() 一次？

发布于 2024-10-17 10:35:11 字数 312 浏览 2 评论 0原文

一个真正精简的版本：

场景两个选择器我正在制作动画，然后使用 .load() 加载外部页面看来 load() 为 element_A 和 element_B 触发了两次...... 有没有办法让它只触发一次？

$('.element_A, .element_B').click(function(){

   //...

   $(".element_C").load("someFile", etc);

   //...

});

原文

A really stripped down version:

Scenario two selectors I am animating and then loading an external page using .load()
It seems the load() is triggerd twice for element_A and element_B ...
Is there a way to have it only trigger once?

$('.element_A, .element_B').click(function(){

   //...

   $(".element_C").load("someFile", etc);

   //...

});

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

壹場煙雨 2024-10-24 10:35:11

使用标志来指示 .load() 是否已经运行。

var triggered = false; // our flag

$('.element_A, .element_B').click(function(){
        // if it hasn't run yet, run it and set "triggered" to "true"
    if( !triggered ) {
        $(".element_C").load("someFile", etc);
        triggered = true;
    }
});

如果需要，您可以在 load 的回调中将其设置回 false。

或者，如果它触发两次的原因是选择器中的一个元素嵌套在另一个元素内，那么这是因为事件正在冒泡。

您可以使用 return false; 或 event.stopPropagation( )^(docs) 方法。

$('.element_A, .element_B').click(function( event ){
        // prevent the event from bubbling and triggering the handler again
    event.stopPropagation();

    $(".element_C").load("someFile", etc);

});

Use a flag to indicate if the .load() has already run.

var triggered = false; // our flag

$('.element_A, .element_B').click(function(){
        // if it hasn't run yet, run it and set "triggered" to "true"
    if( !triggered ) {
        $(".element_C").load("someFile", etc);
        triggered = true;
    }
});

You can set it back to false in the callback for the load if needed.

Or if the reason why it is firing twice is that one of the elements in the selector is nested inside the other, then it is because the event is bubbling.

You can prevent bubbling with return false; or the event.stopPropagation()^(docs) method.

$('.element_A, .element_B').click(function( event ){
        // prevent the event from bubbling and triggering the handler again
    event.stopPropagation();

    $(".element_C").load("someFile", etc);

});

回复收藏 0 原文

一桥轻雨一伞开 2024-10-24 10:35:11

patrick dw 为解决方案奠定了基础。需要添加某种指示器才能仅触发一次负载。

$temp_LoadCounter = 0; // added

$('.element_A, .element_B').click(function(){

   //...

   $temp_LoadCounter += 1; // added

   if ($temp_LoadCounter == 1) { // added

      $(".element_C").load("someFile", etc);

   //...

   } // added

});

patrick dw built the foundation for the solution. An indicator of some kind needed to be added for the load to be triggered only once.

$temp_LoadCounter = 0; // added

$('.element_A, .element_B').click(function(){

   //...

   $temp_LoadCounter += 1; // added

   if ($temp_LoadCounter == 1) { // added

      $(".element_C").load("someFile", etc);

   //...

   } // added

});

回复收藏 0 原文

~没有更多了~