jquery - 执行一次 keyup

Question

当我开始输入文本框时，我正在尝试加载 gif 加载器。我将它附加到包含 keyup 上的文本框的 div 中。我遇到的问题是每次我输入一个字母时都会附加加载器，而我只想在输入第一个字母时附加一次。

function loader(){

    $('#contrib_search').bind('keyup', function(){
        $('#contrib_text').append('<div id="loader"></div>');
    });
}

知道怎么做吗？
谢谢

Answer 1

使用“一个”可以帮助：

function loader() {
  $('#contrib_search').one('keyup', function () {
    $('#contrib_text').append('<div id="loader"></div>');
  });
}

Answer 2

添加加载程序后，您可以取消绑定keyup

function loader(){

    $('#contrib_search').bind('keyup', function(){
        $('#contrib_text').append('<div id="loader"></div>');
        $('#contrib_search').unbind('keyup');  //or $(this).unbind probably a tad faster
    });
}

Answer 3

我的建议是将加载程序硬编码到您的 HTML 代码中，然后.show()在.keyup()事件处理程序上。

然后例如在.blur()事件.hide()它并且问题消失了。

编辑：

var $contrib = $('#contrib_text');

$contrib.bind({
    keyup: function(){
       $contrib.find("#loader").show();
    },
    blur: function(){
       $contrib.find("#loader").hide();
    }
});

Answer 4

也许这可以工作：

var pressed = false;
    function loader(){

        $('#contrib_search').bind('keyup', function(){
            if (pressed == false ){
                $('#contrib_text').append('<div id="loader"></div>');
                pressed = true;
            }
        });
    }

或者不使用这个布尔值，只需调用 unbind 而不是我的行，说 press = true;