Question

我创建了一个仅使用javascript（无提交）处理的表单，并发现当我弹出警报时Google Chrome正在删除所有输入。经过一些实验，我发现Chrome的行为有所不同，具体取决于是从按钮元素还是输入元素调用javascript警报。特别是，当您单击“确定”时，HTML按钮将导致删除输入框中的文本。这不会发生在IE中。我没有在其他浏览器中尝试过。输入元素不会发生这种情况，如果它位于表单之外，则不会发生按钮元素。

有没有其他人注意到这一点，或者知道原因应该如此？

<form>
<p>Enter some text in the input box, then click one of the buttons.</p>
<input type="text"><br>
<input type="button" onclick="alert('What happens to form values?')" value="Input button">    <br>
<button onclick="alert('What happens to form values?')">HTML button</button>
</form>

Answer 1

点击时<button>正在提交表单提交表单会重新加载页面。

要防止这种情况，请将return false添加到处理程序的末尾。

Answer 2

基于w3schools http://www.w3schools.com/tags/att_button_type.asp

始终指定元素的type属性。不同的浏览器可能会为元素使用不同的默认类型。

在您的情况下，您希望类型为button（否则某些浏览器将默认为submit）

<button type="button" onclick="alert('What happens to form values?')">HTML button</button>

javascript，谷歌浏览器以不同方式处理来自输入和HTML按钮的警报调用

2 个答案: