0

フィールド値を取得することで複数のフォームに個別に値を投稿することを要求するフォームを持つタスクがあり、すべてのフォーム送信呼び出しごとに単一のイベント関数が適用されるため、ページに同じ識別子を持つ複数のフォームが存在する可能性があります。最初のフィールドの値のみを処理するこの作業例を確認し、可能であれば一般的な JavaScript で何かを提案してください。

<script>
    function Order() {
        var formi=document.getElementById("test").value;
        document.getElementById("result").value=document.getElementById("test").value;
        alert(formi);
    }
</script>

<form onsubmit="Order();return false;">
<input type="text" id="test" value="">
<input type="text" id="result" value="">
<input type="submit" value="Order">
</form>

<form onsubmit="Order();return false;">
<input type="text" id="test" value="">
<input type="text" id="result" value="">
<input type="submit" value="Order">
</form>
4

2 に答える 2

0

考えられる解決策の 1 つ:

<form method="post" onsubmit="order(this); return false;">
<input type="text" class="test" value="foo">
<input type="text" class="result" value="bar">
<input type="submit" value="Order">
</form>

<form method="post" onsubmit="order(this); return false;">
<input type="text" class="test" value="abc">
<input type="text" class="result" value="def">
<input type="submit" value="Order">
</form>

<script>
var order = function (form) {
    var fields = form.querySelectorAll('input');
    alert(fields[0].value + ', ' + fields[1].value);
}
</script>

デモ: http://jsfiddle.net/KyHMf/

于 2013-09-09T21:39:31.710 に答える
0

同じ ID を複数回使用しないでください。HTML では許可されておらず、意図したとおりに機能しません。

コードの改良版は次のとおりです。

var forms = document.getElementsByTagName('form');

function FormSubmit(e) {
    e.preventDefault();
    var text = e.target.children[0].value;
    for (var i = 0; i < forms.length; i++) {
        forms[i].children[1].value = text;
    }
}

for (var i = 0; i < forms.length; i++) {
    forms[i].onsubmit = FormSubmit;
}

ここで試すことができます。わかりやすくするために、コードにはいくつかの追加コメントがあります。

http://jsfiddle.net/Hq8uz/1/

于 2013-09-09T22:00:08.633 に答える