200

jQuery を使用してフォームの非表示フィールドの値を設定しようとしましたが、成功しませんでした。

問題を説明するサンプル コードを次に示します。入力タイプを「テキスト」のままにしておけば、問題なく動作します。ただし、入力タイプを「非表示」に変更しても機能しません!

<html>

    <head>
        <script type="text/javascript" src="jquery.js">
        </script>
        <script type="text/javascript">
            $(document).ready(function() {
                $("button").click(function() {
                    $("input:text#texens").val("tinkumaster");
                });
            });
        </script>
    </head>

    <body>
        <p>
            Name:
            <input type="hidden" id="texens" name="user" value="texens" />
        </p>
        <button>
            Change value for the text field
        </button>
    </body>

</html>

入力タイプを「テキスト」に設定し、入力ボックスに「display:none」スタイルを使用して、次の回避策も試しました。しかし、これも失敗です！jQuery では、非表示または非表示の入力フィールドの設定に問題があるようです。

何か案は？実際に機能するこれに対する回避策はありますか？

4

17 に答える 17

337

:textタイプ値が の入力に対しては失敗しますhidden。また、次を使用する方がはるかに効率的です。

$("#texens").val("tinkumaster");

ID 属性は Web ページで一意である必要があります。これが問題の原因となる可能性があるため、独自のものであることを確認してください。より複雑なセレクターを指定すると処理が遅くなり、見栄えも悪くなります。

http://jsbin.com/elovo/editの例、 http: //jsbin.com/elovo/2/editのサンプルコードを使用

于 2010-06-05T09:12:11.560 に答える
65

ID を渡すために非表示フィールドの値を設定するのに問題がある場合、これが解決策です。

$("#hidden_field_id").val(id)ただ行う代わりに$("input[id=hidden_field_id]").val(id)。違いはわかりませんが、動作します。

于 2011-11-09T23:23:22.190 に答える
18

私は同じ問題を抱えていました。奇妙なことに、十分なGoogle Chromeとおそらく他の人（わからない）が好きではなかった

$("#thing").val(0);

input type="hidden" id="thing" name="thing" value="1" />

（変化なし）

$("#thing").val("0");

input type="hidden" id="thing" name="thing" value="1" />

（変化なし）

しかし、これは機能します!!!!

$("#thing").val("no");

input type="hidden" id="thing" name="thing" value="no" />

変化!!

$("#thing").val("yes");

input type="hidden" id="thing" name="thing" value="yes" />

変化!!

「文字列のもの」でなければなりません

于 2011-07-05T07:27:15.467 に答える
12 
$('input[name=hidden_field_name]').val('newVal');

どちらも私のために働いた

$('input[id=hidden_field_id]').val('newVal');

または

$('#hidden_field_id').val('newVal');

やりました。

于 2014-08-20T10:40:51.923 に答える
10

.valは、サーバー側の値属性を取得していて、値が常に更新されるとは限らなかったため、うまくいきませんでした。だから私は使用しました：

var counter = 0;
$('a.myClickableLink').click(function(event){
   event.preventDefault();
   counter++;

   ...
   $('#myInput').attr('value', counter);
}

それが誰かを助けることを願っています。

于 2013-05-17T20:03:54.447 に答える
7

実は、これは進行中の問題です。Andy はダウンロードしたソースについては正しいのですが、.val(...) と .attr('value',...) は実際には html を変更していないようです。これはjqueryの問題ではなく、JavaScriptの問題だと思います。firebug を使用していたとしても、同じ質問があったでしょう。値を変更してフォームを送信すると通過するように見えますが、html は変更されません。変更されたフォームの印刷プレビューを作成しようとして ([form].html() を実行して)、この問題に遭遇しました。値が変わります。したがって、私のモーダル印刷プレビューはやや役に立ちません...私の回避策は、追加した値を含む非表示のフォームを「構築」するか、プレビューを個別に生成して、ユーザーが行う各変更もプレビューを変更する必要がある場合があります。どちらも最適ではありませんが、値設定の動作がhtmlを変更しない理由を誰かが理解しない限り（私が想定しているDOMで）、それを行う必要があります。

于 2010-09-10T21:40:59.263 に答える
4

私の場合、機能しない val() のパラメーターとして非文字列 (整数) を使用していましたが、トリックは次のように単純です。

$("#price").val('' + price);
于 2016-09-18T06:40:29.977 に答える
2

使用val()してもうまくいきませんでした。私は.attr()どこでも使用しなければなりませんでした。また、さまざまな種類の入力があり、チェック ボックスと選択メニューの場合はかなり明確にする必要がありました。

テキストフィールドを更新

$('#model_name').attr('value',nameVal);

ファイル入力の横にある画像を更新する

$('#img-avatar').attr('src', avatarThumbUrl);

ブール値を更新

if (isActive) {
    $('#model_active').attr('checked',"checked");
} else {
    $('#model_active').attr('checked', null) ;
}

選択を更新(数値または文字列で)

$('#model_framerate').children().each(function(i, el){
    var v = $(el).val();
    if (v === String(framerateVal)) { 
        $(el).attr('selected','selected');
    } else {
        $(el).attr('selected',null);
    }
}
于 2016-01-07T17:14:43.520 に答える
1

ここで別の落とし穴が私の時間を無駄にしたので、そのヒントを伝えようと思いました。id を指定した隠しフィールドがありました。名前に[]角かっこが含まれているため（struts2で使用するため）、セレクター$("#model.thefield[0]")は隠しフィールドを見つけられません。ピリオドと括弧を使用しないように ID の名前を変更すると、セレクターが機能し始めました。そのため、最終的に代わりのIDmodel_the_field_0になり、セレクターは正常に機能しました。

于 2012-10-24T18:03:14.070 に答える
-1 
<javascript>


slots=''; hidden=''; basket = 0;

    cost_per_slot = $("#cost_per_slot").val();
    //cost_per_slot = parseFloat(cost_per_slot).toFixed(2)

    for (i=0; i< check_array.length; i++) {
        slots += check_array[i] + '\r\n';
        hidden += check_array[i].substring(0, 8) + '|';
        basket = (basket + parseFloat(cost_per_slot));
    }

    // Populate the Selected Slots section
    $("#selected_slots").html(slots);

    // Update hidden slots_booked form element with booked slots
    $("#slots_booked").val(hidden);     

    // Update basket total box
    basket = basket.toFixed(2);
    $("#total").html(basket);

于 2015-11-09T20:55:03.127 に答える