HTML按钮不提交表单

2020/09/29 12:01 · javascript ·  · 0评论

我有一个表格。在该表格之外,我有一个按钮。一个简单的按钮,如下所示:

<button>My Button</button>

不过,当我单击它时,它会提交表单。这是代码:

<form id="myform">
    <input />
</form>
<button>My Button</button>

该按钮应该做的就是编写一些JavaScript。但是,即使看起来像上面的代码一样,它也会提交表单。当我将标签按钮更改为跨度时,它可以正常工作。但不幸的是,它必须是一个按钮。有什么方法可以阻止该按钮提交表单?像例如

<button onclick="document.getElementById('myform').doNotSubmit();">My Button</button>

我认为这是HTML最令人讨厌的小特性...该按钮必须为“按钮”类型才能不提交。

<button type="button">My Button</button>

更新2019年2月5日:根据HTML生活标准(以及HTML 5规范):

缺失值默认无效值默认是提交按钮状态。

return false;在onclick处理程序的末尾将完成此工作。然而,这是更好地简单地添加type="button"<button>-它正确的行为,即使没有任何JavaScript的方式。

默认情况下,html按钮提交表单。

这是因为即使位于表单外部的按钮也可以充当提交者(请参阅W3Schools网站:http : //www.w3schools.com/tags/att_button_form.asp)。

换句话说,按钮类型默认为“提交”

<button type="submit">Button Text</button>

因此,解决此问题的一种简单方法是使用按钮类型

<button type="button">Button Text</button>

其他选项包括在onclick或单击按钮时的其他任何处理程序的末尾返回false ,或者改为使用<input>标记

要了解更多信息,请查看按钮上Mozilla开发人员网络的信息:https : //developer.mozilla.org/en/docs/Web/HTML/Element/button

戴夫·马克尔(Dave Markle)是正确的。W3School的网站

始终为按钮指定type属性。Internet Explorer的默认类型是“按钮”,而在其他浏览器(和W3C规范)中,默认类型是“提交”。

换句话说,您使用的浏览器遵循W3C的规范。

建议不要使用<Button>标签。请改用<Input type='Button' onclick='return false;'>标签。(使用“ return false”确实不应该发送表格。)

一些参考资料

出于可访问性原因,我无法通过多个type=submit按钮将其关闭到了本机的唯一途径form有多个按钮,但只有一个可以提交击中当表单Enter关键是要确保只有其中之一是type=submit有些则是在其他类型如type=button这样,就键盘支持而言,在浏览器上处理表单时,您可以从更好的用户体验中受益。

对我有用的另一个选项是添加onsubmit =“ return false;”。到表单标签。

<form onsubmit="return false;">

从语义上讲,解决方案可能不如上述更改按钮类型的方法那么好,但是如果您只希望不提交表单元素,那么这似乎是一个选择。

本文地址:http://javascript.askforanswer.com/htmlanniubutijiaobiaodan.html
文章标签: ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!