全局覆盖 <button> 的默认类型属性

Question

根据 W3 Schools（链接 1 链接 2），大多数<button>浏览器的标签type属性默认'submit'为。我想为我的网站更改此设置，因此每当我省略a 上的属性时，它都会默认为。type<button>type='button'

我编写了以下 Javascript 并将其放置在所有网页包含的文件中：

$(function() {

  // Select all buttons without a type explicitly set, and give them a default type.

  $('button:not([type])').prop('type', 'button');

});

当然，这并不是一个很好的解决办法。<button>我在没有显式设置类型的情况下动态生成的任何元素都将默认为type='submit'（对于大多数浏览器）。

还有其他解决方案吗？<meta>也许我可以使用某种标签？

编辑：还有另一种解决方案。

我的页面设置了一个<form>围绕页面大部分的元素。然后我有一个<button>内部表单，旨在动态创建文本框，文本框本身<input type='hidden'>通过一些 Javascript 魔法连接到一个。我还在整个页面上散布了一些正常的静态内容<input type='text'>，这些内容打算与表单一起提交。正确的<button type='submit'>位于页面底部。

我能做的是重构我的页面，使唯一<form>包围<button>页面底部的 ，然后使用它们的form属性挂钩我想要包含在提交中的所有元素，如下所示：

<button>Generate dynamic textbox</button>

<!-- Generated textboxes go here... -->

<input type='hidden' name='dynamicTextboxAccumulation' form='breakfast_menu'>

<input type='text' name='order' value='spam' form='breakfast_menu'>

<form id='breakfast_menu' action='/order/place' method='post'>

  <button type='submit'>Place Order</button>

</form>

Answer 1

我通常会写出比这更好的答案，所以请原谅我这个......没有。任何 HTML 元素属性及其值都由浏览器来解释。唯一的选择是显式设置type.