Question

我一直在尝试向此函数添加一个keydown事件，这样它不仅可以在单击SUBMIT时提交表单，而且还可以在按下ENTER时提交。我的代码和我要添加的代码如下。我试图让两者一起工作，但我对如何添加第二个代码块感到困惑。哦，从HTML文件中的HTML提交按钮元素调用validate（）。我是否需要从HTML中删除它并创建一个可以执行这两个操作的全新功能？

有人可以帮忙吗，谢谢你？

这是我的代码：

function validate() {
  var username = document.getElementById("username").value;
  var password = document.getElementById("password").value;

  if (username == "abc" && password == "123") {
    window.location = "http://www.google.com"; 
    return false;
  } else {
    alert("The user name or password is invalid.");
  }
}

这是我要添加的代码：

function (event) {
    if (event.which == 13 || event.keyCode == 13) {
        //code to execute here
        return false;
    }
    return true;
};

Answer 1

在我看来，你应该向身体添加事件然后验证它。

试试这个：

document.getElementById('body').addEventListener('keypress', function(e) {
if (event.which == 13 || event.keyCode == 13) {
/* validate your form here and submit your form */
    document.forms[0].submit();
    return false;
}
return true;
});

Answer 2

经过一些更多的研究，我发现了这个链接http://jsfiddle.net/Jaganathan/6AWkH/2/，并从那里找到了一个可行的解决方案，我需要的东西。

我最终使用的代码如下。我希望它也能帮助别人。

$(function() {
   
   $('body').keypress(function(event) {
      var username = document.getElementById("username").value;
	  var password = document.getElementById("password").value;
	   if (event.which == 13) {
		   if (username == "abc" && password == "123") {
			   window.location = "/Sites/IRAnalystDay2015/homepage/index.htm"; //redirecting to other page
			   return false;
		   } else {
			   alert(
				   "The user name or password is invalid."
			   );
		   }
	   }
   });
   
   $("#submit").click(function() {
      var username = document.getElementById("username").value;
	  var password = document.getElementById("password").value;
	   var e = jQuery.Event('keypress');
	   e.which = 13; // #13 = Enter key
	   if (username == "abc" && password == "123") {
		   window.location = "/Sites/IRAnalystDay2015/homepage/index.htm"; //redirecting to other page
		   return false;
	   } else {
		   alert("The user name or password is invalid.");
	   }
   });
   
});

<html>
  <head>
    <title>Javascript Login Form Validation</title>

	<!-- include css file here-->
    <link rel="stylesheet" href="css/style.css"/>
	
	<!-- include javascript file here-->
	<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="js/login.js"></script> 
      
  </head>
  <body>
	<div class="container">
	  <div class="main"> 
		<form id="form_id" method="post" name="myform">
		  <label>User Name :</label></br>
		  <input type="text" name="username" id="username"/></br>
 
		  <label>Password :</label></br>
		  <input type="password" name="password" id="password"/></br>
 
		  <input type="button" value="Login" id="submit" />
		</form>
	  </div>

	</div>
 </body>
</html>

尝试将keydown事件添加到函数

2 个答案: