javascript - Javascript重复事件

Question

如果焦点在输入上，它只工作一次，但如果更多，则附加事件开始工作的次数与 eliment 处于焦点时一样多。如何使点击事件只执行一次？下面是代码。

$('.menuName').focusin(function(){  

        $(this).parent().append('<div class="cleartext" style="position: absolute;right: 0px;top: 0px;height: 38px;width:32px;z-index: 999;"><i class="icon-remove-circle"></i></div>');

        inputclr = $(this);
        intutval = $(inputclr).val();

        $(document).on('click', '.cleartext', function() {

            $('.menuName').placeholder();
                $(inputclr).attr('placeholder',intutval);
            $('.pinch_text').html('click');
            $(inputclr).val('').focus();

        });
    });

Answer 1

您应该使用 off 函数删除所有侦听器：

$(document).off('click','.cleartext').on('click', '.cleartext', function() {

    $('.menuName').placeholder();
        $(inputclr).attr('placeholder',intutval);
    $('.pinch_text').html('click');
    $(inputclr).val('').focus();

});

Answer 2

将您的代码置于焦点事件之外

 $(document).on('click', '.cleartext', function() {

            $('.menuName').placeholder();
                $(inputclr).attr('placeholder',intutval);
            $('.pinch_text').html('click');
            $(inputclr).val('').focus();

        });
var inputclr , intutval ;
$('.menuName').focusin(function(){  

        $(this).parent().append('<div class="cleartext" style="position: absolute;right: 0px;top: 0px;height: 38px;width:32px;z-index: 999;"><i class="icon-remove-circle"></i></div>');

        inputclr = $(this);
        intutval = $(inputclr).val();


    });