Onclick event + Enter key

Question

我在网站上有一个非常简单的登录脚本，它只使用一个简单的密码，而且它确实很好，我需要它。事情是，它只有在单击“登录”字时才起作用。我需要做的是在按Enter键时也能工作。 here's代码：

<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> 

我已经尝试添加的输入类型和其他东西，但没有使它工作:(

UPDATE：

同时，我改变了代码如下：

<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> 

但现在按什么键也进行验证，所以它甚至不能输入密码...... i'm人仍下落不明的东西在这里

Answer 1

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

Answer 2

JavaScript的替代方法是将type="submit"添加到HTML中。大多数浏览器默认使用Enter键绑定。

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

Answer 3

它附加到文档：

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 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

对于一个完整的解决方案看下面（更改登录链接到黑色，所以你可以看到它）：

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(); 
 
    } 
 
}

<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>