Question

我一直在使用HTML5的按钮表单属性让我的提交按钮显示在表单之外，仍然会触发我的提交。

我的表单看起来像这样：

<article>
  <header>This is my form</header>
  <section>
    <p>Something explaining what is happening on this form.</p>
    <form id="myform" action="/submit" name="myform">
      <input type="text" name="thing">
    </form>
  </section>
  <footer>
     <button type="submit" form="myform">Submit</button>
  </footer>
</article>

我在Chrome / Firefox / Safari中运行良好，但我今天在IE10中测试了它并且表单没有提交！

除了重新设计我的所有页面以不使用form =属性外，有没有人知道如何解决这个问题？我希望它像表单中的普通提交按钮一样工作，在文本字段中按Enter键将提交表单以及单击按钮。

我想避免添加点击事件并在文本字段中侦听输入，以便在可能的情况下触发JavaScript提交。

Answer 1

似乎IE上不支持属性form="myForm"。

查看此处的表格了解更多信息： http://caniuse.com/#search=Form%20features

仅复制此方法的方法是使用/创建一个javascript polyfill来复制所需的行为。

您可以在此处找到跨浏览器polyfill的列表：
https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills

我找不到填写form行为的人（但只查找了一分钟，所以请自行检查）。

我认为您必须为此编写自己的自定义polyfill。

简单的内联onclick如下所示：

<button 
    type="submit"
    form="myform"
    onclick="javascript:getElementById(this.getAttribute('form')).submit();"
>Submit</button>

JSFiddle：http://jsfiddle.net/mf63k/4/

在IE10中支持/填充按钮表单属性的任何方法？

1 个答案: