首页 > 解决方案 > jQuery:删除一个特定的点击处理程序保留其他人

问题描述

我有form一些字段,每个字段都绑定了一些click事件(与此功能无关)。

我必须在每个字段中添加另一个以在第一次单击其中任何一个时显示模式,并且仅在第一次单击时显示。

我想是这样的:

    $('.field').on('click',function(){
        $('#modal').modal();
        $('.field').off('click');
    });

这个想法是,在第一次点击之后,该.off()方法将从所有.field元素中删除“点击处理程序”。

如果不存在其他引用的“点击处理程序”,那就太好了,因为这样我将删除所有这些。

我需要从所有字段中删除这个特定的“点击处理程序”,保留其他字段,这样,模式窗口应该只在第一次点击任何表单字段时出现,并且永远不会在点击下一个字段时再次出现。

请问,怎么办?

标签: jquery

解决方案


创建一个函数,在调用后将自身从处理程序中删除

function showModalOnlyOnce(){
  console.log("Show modal") ;
  $('.field').off('click',showModalOnlyOnce);
}

并使用on

$('.field').on('click',showModalOnlyOnce);

这不会影响其他click处理程序,如下面的代码片段所示。“我已被点击”消息总是被写入,但“显示模式”消息只出现一次

function showModalOnlyOnce(){
  console.log("Show modal") ;
  $('.field').off('click',showModalOnlyOnce);
}


$('.field').on('click',function(){
    console.log("Ive been clicked");   
});

$('.field').on('click',showModalOnlyOnce);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="field">
<input type="text" class="field">
<input type="text" class="field">
<input type="text" class="field">


推荐阅读