Любой способ поддержки / шим кнопки атрибута формы в IE10?

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 =, кто-нибудь знает, как обойти это? Я хочу, чтобы она работала как обычная кнопка отправки внутри формы, когда нажатие клавиши ввода в текстовом поле отправит форму так же, как нажатие кнопки.

Я хотел бы избегать добавления событий щелчка и прослушивания ввода в текстовых полях, чтобы инициировать отправку в JavaScript, если это возможно.

Answer 1

Похоже атрибут form="myForm" не поддерживается в IE.

Посмотрите таблицу здесь для получения дополнительной информации: http://caniuse.com/

Единственный способ повторить это будет использовать / создать Javascript Polyfill для репликации желаемого поведения.

Вы можете найти список кросс-браузерных полифилов здесь:
https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills

Я не мог найти тот, чтобы заполнить form поведение (но только посмотрел на минуту, так что проверьте себя).

Я думаю, что вам придется написать свой собственный полифилл для этого.

Простой встроенный onclick будет выглядеть так:

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

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