Question

我在一个网站上有一个非常简单的登录脚本，它只使用一个简单的密码，它可以很好地满足我的需求。事情是，它只在单击“登录”字时才有效。我需要它做的是按Enter键时也能工作。这是代码：

<div style="background-image:url(images/IMG_Log_In_teste.jpg);width:1490px;height:243px;color:black;font-size:20px;" >
        <br></br>
        <a href="areaclienteOLD.html" onclick="javascript:return validatePass()">
        <div class="cities">
            <font color="white">                            
                LOGIN
            </font>
        </div>
        </a><br></br>
        <input id='PASSWORD' type='PASSWORD'  />
        <a href="areaclienteOLD.html" onclick="javascript:return validatePass()"></a><br></br>
        <script>
            function validatePass(){
            if(document.getElementById('PASSWORD').value == 'pkmass1725'){
            return true;
                }else{
            alert('Password errada! Tente de novo.');
                    return false;
                }
            }
        </script>                       
    </div>

我已经尝试过添加输入类型和其他东西，但没有任何东西能让它起作用：（

更新：

同时我将代码更改为：

<div style="background:blue;width:1490px;height:243px;color:black;font-size:20px;" >
        <a href="areaclienteOLD.html" onclick="javascript:return validatePass()">
        <div class="cities">
            <font color="white">                            
                LOGIN
            </font>
        </div>
        </a>
        <input id='PASSWORD' type='PASSWORD'  onkeydown="javascript:return validatePass()"/>
        <a href="areaclienteOLD.html" onclick="javascript:return validatePass()"></a>
        <script>
            function validatePass(){
            if(document.getElementById('PASSWORD').value == 'pkmass1725'){
            return true;
                }else{
            alert('Password errada! Tente de novo.');
                    return false;
                }
            }
        </script>   

        <script>
            document.body.onkeydown = function(e) {
                if (e.keyCode == 13)
                validatePass();
            };
        </script>

    </div>

但是现在无论按下什么键都会执行验证，所以甚至无法输入密码......我还在这里遗漏了一些东西

Answer 1

document.body.onkeydown = function(e) {
    if (e.keyCode == 13)
        validatePass();
};

Answer 2

将其附加到文档：

document.addEventListener('keydown', function(e){
    if (document.getElementById('PASSWORD').value === '') return;
    if (e.which === 13) validatePass();
    // e.which === 13 means enter key is pressed.
});

将其附加到<input id="PASSWORD">：

document.getElementById('PASSWORD').addEventListener('keydown', function(e){
    if (document.getElementById('PASSWORD').value === '') return;
    if (e.which === 13) validatePass();
    // e.which === 13 means enter key is pressed.
});

使用addEventListener是首选方法，因为它不会覆盖绑定到onkeydown事件的其他函数。

Answer 3

JavaScript的替代方法是将type="submit"添加到HTML中。大多数浏览器默认情况下将其与Enter绑定。

实施例： <button type="submit" onclick="validatePass()>LOGIN</button>

Answer 4

首先，让我们创建一个方法来读取将调用您的登录方法的回车键

function inputKeyUp(e) {
e.which = e.which || e.keyCode;
if (e.which == 13) {
    validatePass();
}

}

接下来，让我们在HTML

中的正确位置调用该方法

 <input id='PASSWORD' type='PASSWORD'  onkeyup="inputKeyUp(event)" />

那应该这样做！

Answer 5

onkeyup = fun1(e) 
in password textbox add this event
in script
fun1(e){
if (e.which == 13 || e.keyCode == 13){
       validatePass();
}

Answer 6

有关完整的解决方案，请查看以下内容（将登录链接更改为黑色，以便您可以看到它）：

＆＃13;

function validatePass() {
  if (document.getElementById("PASSWORD").value == 'pkmass1725') {
    // do something if the password was correct
    return true;
  } else {
    alert('Password errada! Tente de novo.');
    return false;
  }
}

function validateOnEnter(event) {
  var key = event.which || event.keyCode;
  if (key == 13) { // enter pressed then invoke the validation method
    validatePass();
  }
}

＆＃13;

<div style="background-image:url(images/IMG_Log_In_teste.jpg);width:1490px;height:243px;color:black;font-size:20px;">
  <br></br>
  <a href="#" onclick="return validatePass()">
    <div class="cities">
      <font color="black">                            
                LOGIN
            </font>
    </div>
  </a>
  <br></br>
  <input id='PASSWORD' type='PASSWORD' onkeypress="validateOnEnter(event)" />
  <a href="#" onclick="return validatePass()"></a>
  <br></br>
</div>

＆＃13;

Onclick事件+输入键

6 个答案: