如何使用jquery防止多次输入按键？

I need to find continuous enter key pressing in jquery. Is this possible?

我需要在jquery中找到连续输入键。这可能吗？

$('#password-input').keyup(function(e) {
    if (e.which == 13) {
        alert("Enter key")
    }
});

Here If I am pressing ENTER key more than one time mean I am getting alerts for two times. But i need to get only one time only.

这里如果我按ENTER键不止一次意味着我会收到两次警报。但我只需要一次。

Please help me!

请帮帮我！

5 个解决方案

#1

You can use jQuery#bind to bind the keyup event and than unbind the keyup event with jQuery#unbind when the end user pres the "Enter key" in order to prevent multiple times the "Enter key":

您可以使用jQuery＃bind来绑定keyup事件，然后在最终用户按下“Enter键”时使用jQuery＃unbind取消绑定keyup事件，以防止多次“Enter key”：

var $passwordInput = $('#password-input');

$passwordInput.bind('keyup', function(e) {
  passwordInputKeyupHandler(e);
});

function passwordInputKeyupHandler(e) {   
  if (e.which === 13) {
    console.log('Enter key!');
    $passwordInput.unbind('keyup');

    return setTimeout(function(){
      console.log('Rebind keyup event');
      $passwordInput.keyup(passwordInputKeyupHandler);
    }, 2000);
  } 

  console.log('Any other key...');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="password-input" type="password">

Note that as pointed out by @dorado on the comments was made a 'rebind' after 2 seconds, using setTimeout(), in order to avoid the end user to have to make a page reload..

请注意，正如@dorado在评论中指出的那样，使用setTimeout（）在2秒后进行'重新绑定'，以避免最终用户必须重新加载页面。

#2

Besides using a variable to store the state I suppose you will also want that if a few milliseconds have passed, then pressing enter key again gives you an alert. This can be achieve by setTimeout. For example, here the enter key will be re-detected only if it is pressed after an interval of 2000ms.

除了使用变量来存储状态之外，我想如果经过几毫秒你也会想要，然后再次按回车键会给你一个警告。这可以通过setTimeout实现。例如，只有在2000ms的间隔后按下回车键，才会重新检测回车键。

var pressed = false;
$('#input-element').keyup(function(e) {
    if (!pressed) {
        if (e.which == 13) {
            pressed = true;
            alert('Enter pressed.');
            i = setTimeout(function() {
                pressed = false;
            }, 2000);

        }
    }
});

#3

Use a variable to store the state

使用变量来存储状态

var pressed = false;
$('#password-input').keyup(function(e) {
    if (!pressed) {
        if (e.which == 13) {
            pressed = true;
            alert('Enter key');
        }
    }
});

#4

Use .setTimeout() to set delay for display alert. In delay time, if enter key pressed again, remove previous timeout and set new timeout. At the end of timeout, display alert.

使用.setTimeout（）设置显示警报的延迟。在延迟时间内，如果再次按下回车键，则删除先前的超时并设置新超时。在超时结束时，显示警报。

var interval;
$('#password-input').keyup(function (e) {
    if (e.which == 13) {
      clearInterval(interval);
      interval = setTimeout(function(){
          alert("Enter key")
      }, 500);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="password-input" />

You can change time of delay to your custom time.

您可以将延迟时间更改为自定义时间。

#5

    var pressed = false;
    $('#password-input').on('keyup',function(e) {
        if (e.which == 13 && !pressed) {
            pressed = true;
            alert("Enter key");
        }
    });

#1