Edited at

jQuery <form/> submit() の注意 on Firefox

jQueryで動的にFormタグを作成しpost()するというテクニックがありますが、どうもFirefoxでは動かなくなる書き方があるようです。

このような書き方はいずれも正しく動きませんでした。

Chrome/Firefox(モバイル)では動くのに、Firefox(PC)ではdata_valueが0固定になってしまいます。

    $('<form/>', {'action': 'program.php', 'method': 'post'})

.append($('<input/>', {'type': 'hidden', 'name': 'data_value'}).val(n))
.appendTo(document.body)
.submit(); // NOT WORK

    $('<form/>', {'action': 'program.php', 'method': 'post'})

.append($('<input/>', {'type': 'hidden', 'name': 'data_value', 'value': n}))
.appendTo(document.body)
.submit(); // NOT WORK

    $('<form action="program.php" method="post"/>')

.append($('<input type="hidden" name="data_value"/>').val(n))
.appendTo(document.body)
.submit(); // NOT WORK

    var post = $('<form/>', {'action': 'program.php', 'method': 'post'})

.append($('<input/>', {'type': 'hidden', 'name': 'data_value', 'value': n}))
.appendTo(document.body)
post.submit(); // NOT WORK

しかし以下のようにformにidを付与し、idを使ってセレクタで選択し直し、ネイティブのsubmit()を呼ぶと正しく動作します。

    $('<form/>', {'action': 'program.php', 'method': 'post', 'id': 'myForm'}) //書き方は自由

.append($('<input/>', {'type': 'hidden', 'name': 'data_value'}).val(n)) // ↑
.appendTo(document.body)
$("form#myform")[0].submit(); // WORK!

海外のフォーラムでもFirefoxでは確実に存在するFormしか受け付けない?

ID無しのappend()appendTo()ではネイティブのDOMメモリ上のform[]に反映されない?

などの憶測が飛び交っていますが、確たる証拠はなさそうです。