1

以下のコードがonclickで動作しています。

<form action="" name="testform" method="post" id="testform">
<input type="hidden" value="" name="a">
<input type="hidden" value="" name="b">
<input type="hidden" value="" name="c">
<select>
    <option value=""></option>
    <option value="" onclick="document.testform.a.value='12'; document.testform.b.value='111'; document.testform.c.value='123'">1</option>
    <option value="" onclick="document.testform.a.value='21'; document.testform.b.value='222'; document.testform.c.value='232'">2</option>
    <option value="" onclick="document.testform.a.value='32'; document.testform.b.value='333'; document.testform.c.value='233'">3</option>
    <option value="" onclick="document.testform.a.value='43'; document.testform.b.value='444'; document.testform.c.value='344'">4</option>
    <option value="" onclick="document.testform.a.value='54'; document.testform.b.value='555'; document.testform.c.value='345'">5</option>
</select>     

1 を選択すると、a、b、c の非表示フィールドの値は 1 になります。

これは問題なく動作しますが、ユーザーがフォーム全体で「a」に複数の値を選択できる、より大きなプロジェクトをここで考えています。onclick がなければ、これをうまく機能させることができます。

<input type="hidden" name="a[]" value="1">

しかし、私がするとき

<form action="" name="testform" method="post" id="testform">
<input type="hidden" value="" name="a[]">
<input type="hidden" value="" name="b[]">
<input type="hidden" value="" name="c[]">
<select>
    <option value=""></option>
    <option value="" onclick="document.testform.a[].value='12'; document.testform.b[].value='111'; document.testform.c[].value='123'">1</option>
    <option value="" onclick="document.testform.a[].value='21'; document.testform.b[].value='222'; document.testform.c[].value='232'">2</option>
    <option value="" onclick="document.testform.a[].value='32'; document.testform.b[].value='333'; document.testform.c[].value='233'">3</option>
    <option value="" onclick="document.testform.a[].value='43'; document.testform.b[].value='444'; document.testform.c[].value='344'">4</option>
    <option value="" onclick="document.testform.a[].value='54'; document.testform.b[].value='555'; document.testform.c[].value='345'">5</option>
</select>     

隠し値には何も挿入されません。

どうしてこれなの?

私がjQueryでやろうとしていることを行うためのより良い方法はありますか?

4

2 に答える 2

4

問題の変更されたjsfiddleリンクは次のとおりです。 http://jsfiddle.net/et3r7/12/これが役立つかどうかを確認してください。非表示にすることができる結果を表示するために、テキストを非表示にしました。

私はあなたのコードを少し整理しました。すべての onClick コードを削除しました。

于 2012-07-23T12:50:14.490 に答える
2

.valueそれは配列のプロパティではないと思います。(実際、私は derp です。配列要素のプロパティである可能性があります。調べてみます)要素を追加するための配列のpush()メソッドも調べます。

このタスクに取り組む方法は他にもいくつかあります。JS を使用すると、これを少し抽象化し、各クリックが行う作業を 1 つの関数で行うことができます。これにより、コードがより簡潔になります。

これは jQuery の場合も簡単に実行できますが、この機能が追加でダウンロードする価値があるかどうかは評価中です (jQuery は 32 KB 圧縮されて圧縮されています)。

于 2012-07-23T12:45:02.550 に答える