javascript - HTML:JavaScript:阻止表单提交和调用 Javascript 函数

Question

我想在按下表单中的提交按钮时进行 AJAX 调用。 事实上，我无法删除 <form>因为我也想进行客户端验证。 我试过这段代码。

<form name="search" >
Name: <input type="text" name="name1"/>
Age: <input type="text" name="age1"/>
<input type="submit" name="Submit" value="Submit" onclick="makeSearch()"/>
</form>

JS

function makeSearch(){
alert("Code to make AJAX Call");
}

使用此代码后，alert() 未显示，但页面已重新加载。 我想阻止页面重新加载并调用 JS 函数。

谢谢

Answer 1

在form标签中添加onsubmit属性:

<form name="search" onsubmit="return makeSearch()" >
  Name: <input type="text" name="name1"/>
  Age: <input type="text" name="age1"/>
  <input type="submit" name="Submit" value="Submit"/>
</form>

并且javascript在末尾添加return false:

function makeSearch() {
  alert("Code to make AJAX Call");
  return false;
}