如何使用提交按钮和输入按钮提交值？

Question

有人可以帮我一些JavaScript代码吗？

我将在单击“提交”按钮并按“ Enter”键后启动javascript函数。我已经编写了此代码，但它可以单独工作，但是一起使用Enter键无效。怎么了？

谢谢！

<form onsubmit="SubmitFormData(); return false;" id="myForm" method="post">

 Name:    <input name="name" id="name" type="text" /><br />


<input type="submit" id="submitFormData" onclick="SubmitFormData();" value="Submit" />
</form>

<script>
var input = document.getElementById("name");
input.addEventListener("keyup", function(event) {
  if (event.keyCode === 13) {
   event.preventDefault();
   SubmitFormData();
  }
});
</script>

function SubmitFormData() {
var name = $("#name").val();
$.post("submit.php", { name: name },
function(data) {
 $('#results').html(data);
 $('#myForm')[0].reset();
});
}

Answer 1

您可以尝试以下方式：

var input = document.getElementById("name");
input.addEventListener("keyup", function(){SubmitFormData(event)});
var submitBtn = document.getElementById("submitFormData");
var SubmitFormData = function(event){
  if (event.keyCode === 13) {
   submitBtn.addEventListener("click", SubmitFormData);
  }
}
submitBtn.addEventListener("click", SubmitFormData);

<form id="myForm" method="post">
  Name:<input name="name" id="name" type="text" /><br />
  <input type="submit" id="submitFormData" value="Submit" />
</form>

请注意：您必须将按钮的类型更改为submit才能提交表单。

Answer 2

仅当您单击SubmitFormData()按钮（向其添加了input属性）时，您的onclick功能才起作用。

您应该删除它，并将以下属性添加到form：onsubmit="SubmitFormData(); return false;"

Obs .：更改输入的type属性。 type="button"是错误的。使用type="submit"。