Question

我希望用户通过按“输入”来搜索。键。

出于某种原因，当我多次使用回车键搜索时，我的程序开始重复调用youtubeAPI，2组相同的5个视频。如果你再次点击ENTER，它现在会返回3组5个视频......依此类推。

这是我如何允许输入键：

//allow them start search by hitting enter key:
$("#youtube-headerContainer-searchBox").focus(function() {
    $(this).keyup(function(e) {
        if(e.which == 13) {
            startIndex=1;
            fetchVideos();
            console.log('enter key pressed');
        }
    });
});

我做了一个小提琴，所以你可以测试它：http://jsfiddle.net/Vna3Z/1/ 只需输入搜索，然后按Enter键即可。然后再次按Enter键。然后再次。你会明白我的意思。

有谁知道为什么？

Answer 1

因为您一次又一次地附加相同的事件处理程序。

每次搜索框获得焦点时（所以你的.focus()处理程序都会运行），这意味着还有一个事件处理程序，因为.keyup()用于在keyup的元素上附加事件处理程序活动 - 每当你打电话给它，你再加上一个！

我不知道为什么你需要.focus()处理程序，你可以简单地做

$("#youtube-headerContainer-searchBox").keyup(function(e) {
    if(e.which == 13) {
        startIndex=1;
        fetchVideos();
        console.log('enter key pressed');
    }
});

或阅读.off()。

Answer 2

简单修复：只需使用one方法附加焦点事件。

...

$("#youtube-headerContainer-searchBox").one('focus', function(){
    $(this).keyup(...);
});

...

jQuery docs：http://api.jquery.com/one

但是对于您的用例，不需要focus处理程序。输入元素只有在聚焦时才会收到keyup事件。

为什么jQuery keyup会重复？

2 个答案: