防止$（“IMG”），点击触发几次

我想知道如何防止确认消息被提示多次，在此先感谢！

的JavaScript

$('img.delete').click(function() {   
    if(confirm("This selected record will be deleted. Are you sure?")){ 
     //Do something... 
    } 
});

HTML

<tbody> 
    <tr> 
     <td><img class="delete" src="/images/delete.gif"><input value="708" type="hidden"></td> 
     <td>aaa</td> 
    </tr> 
    <tr> 
     <td><img class="delete" src="/images/delete.gif"><input value="595" type="hidden"></td> 
     <td>bbb</td> 
    </tr> 
    <tr> 
     <td><img class="delete" src="/images/delete.gif"><input value="19" type="hidden"></td> 
     <td>ccc</td> 
    </tr> 
</tbody>

来源

2012-11-29 Steve Lam

你所说的“多次”是什么意思？ –

它是如何触发多次的？当然，如果他们在“确认”中单击“是”，您将删除该行 - 因此该链接不可能再次单击。 –

参考html代码，确认消息“这个选定的记录将被删除，你确定吗？”已被提示3次。 –

您代码中的问题是您多次应用点击处理程序;这是从您发布的代码中看不到的，但这绝对是原因。

如果运行$('img.delete').click(fn)多次，它不会覆盖以前的点击处理程序;相反，它增加了另一个处理器。之后，单击img.delete时，将连续调用所有注册的处理程序，从而生成一个弹出窗口，然后是另一个窗口。

应该通过调用.unbind()第一予以纠正;这样做会有效地替换以前的点击处理程序。

$('img.delete') 
    .unbind('click') 
    .click(function() {   
     if(confirm("This selected record will be deleted. Are you sure?")){ 
      //Do something... 

      // remove the image here I guess? 
     } 
    });

但是，如果您也可以追查根本原因，那将会更好。

来源

2012-11-29 09:18:25

谢谢你！你完全理解我的问题，你的解决方案对我来说真的很棒。你能解释一下为什么我需要解绑吗？ –

@ user1439709更新后的答案，请仔细阅读:) –

不错！谢谢杰克=] –

您可以通过取消绑定jQuery中做到这一点

$(function(){ 
    $('img.delete').click(function() {   
     if(confirm("This selected record will be deleted. Are you sure?")){ 
      //Do something... 
     } 
     $('img.delete').unbind('click'); 
    }); 

});

来源

2012-11-29 09:16:07 Swarne27

使用jQuery .one()方法，这几乎是什么被造的。

$('img.delete'.one('click',function() {   
      if(confirm("This selected record will be deleted. Are you sure?")){ 
       //Do something... 
      } 
     });

来源

2012-11-29 09:17:12 Blowsie

很好的答案，但你不需要'each'。 '$（'img.delete'）。one（..）''就足够了 – Jamiec

@Jamiec不，这不是真的，如果你这样做，它只会在一个img.delete上工作，而不是全部 – Blowsie

Doom场景：点击'删除' - >点击'否' - >点击'删除'.... awww，不再弹出:( –

如果你担心这个，你可一定要没有事件处理程序后点击：

var confirm_me=function() { 
    if(confirm("This selected record will be deleted. Are you sure?")){ 
     //Do something... 
    } 
    //restore event handler 
    $(this).one('click',confirm_me); 
    //prevent event propagation 
    return false; 
    } 

//BE sure that you not do that in loop. if possible do - see second code 
$('img.delete').one('click',confirm_me);

另一种情况：

var confirm_me=function() { 
    var t=$(this); 
    //check processing flag 
    if (t.data('processing')) return false; 
    //Set processing flag 
    t.data('processing',1); 


    if(confirm("This selected record will be deleted. Are you sure?")){ 
     //Do something... 
    } 

    //restore event handler 
    t.one('click',confirm_me); 
    //remove processing flag 
    t.data('processing',0); 
    //prevent event propagation 
    return false; 
    } 

$('img.delete').one('click',confirm_me);

来源

2012-11-29 09:18:45

使用它，它是我的验证。

<script type="text/javascript"> 
var check = false; 
$(document).ready(function() { 
     $('img.delete').click(function() { 
     if (check != true) { 
      if (confirm("This selected record will be deleted. Are you sure?")) 
       check = true; 
     } 
     else { 
      alert('you have deleted one'); 
     } 
     }); 
    }); 
</script>

来源

2012-11-29 09:21:25

防止$（“IMG”），点击触发几次

回答

相关问题