1

ここでいくつかのコードを手伝ってくれました。要素ではなく div 全体を非表示にするように微調整しました。ちょっとした微調整でしたが、動作を止めるために何かをしたようです。

HTML

<input type="text" name="text-708" value="" class="wpcf7-validates-as-required" size="40">
<div id="added_fields">
    <select name="menu-168" class="wpcf7-validates-as-required">
        <option value="Residential">Residential</option>
        <option value="Commercial">Commercial</option>
    </select>
</div>

JS

if ($("select[name='menu-168']").val() == "Commercial") {
    $("#added_fields").addClass("hidden");
}​

誰かが私が間違っている場所を教えてくれるほど親切でしょうか?

4

10 に答える 10

1

あなたdid not write the code on change event of selectとロード時に選択した値は商用ではないため、 if の下のステートメントは実行されません。

ライブデモ

$("select[name='menu-168']").change(function() {

    if ($("select[name='menu-168']").val() == "Commercial") {
        $("input[name=text-708]").addClass("hidden");
    }
    else
        $("input[name=text-708]").removeClass("hidden");
});​
于 2012-11-30T11:30:43.580 に答える
1

選択値が変更された場合は、選択値のチェックを行う必要があります。

セレクトボックスじゃなくてインプットボックスを隠したい

その場合、#added_fieldsセレクターを変更する必要があります。これを試して：

$("select[name='menu-168']").change(function() {
    if ($(this).val() == "Commercial") {
        $('#added_fields').addClass("hidden");
    }
    else {
        $('#added_fields').removeClass("hidden")
    }
});

フィドルの例

于 2012-11-30T11:31:54.093 に答える
0

option:selected property選択リストの変更イベントに参加していることを確認してください

$("select[name='menu-168']").bind("change",function(e){

    if ($("select[name='menu-168'] option:selected").val() == "Commercial") {
        $("#added_fields").hide();
    }

});
于 2012-11-30T11:37:22.373 に答える
0

イベント「非表示」に「添付」する必要があります。

したがって、この fiddleclick()のように(またはchange()) イベントでこれを行うことができます。

于 2012-11-30T11:40:08.620 に答える
0

hay yomiss は、セレクト ボックスの変更イベントを呼び出します。このフィドルをチェックしてください。 http://jsfiddle.net/K9zGP/44/

 $("select[name='menu-168']").change(function(){
alert($(this).val());
if ($(this).val() == "Commercial") {
$("#added_fields").addClass("hidden");
}

});
于 2012-11-30T11:50:57.260 に答える
0

次の行を変更してみてください

 $("#added_fields").addClass("hidden");

に

 $("#added_fields").hide();
于 2012-11-30T11:30:09.203 に答える
0

試す

$("#added_fields").hide();

詳細については、http : //api.jquery.com/hide/を参照してください。

更新: 選択の変更イベントを参照する場合は、選択の onselectedindexchanged 属性で関数を起動するか、jQuery を介して変更イベントを追加する必要があります。

$("select[name='menu-168']").change(function() {
  if ($(this).val() == "Commercial") {
    $("#added_fields").hide();
  }
});

変更に関する詳細情報: http://api.jquery.com/change/

于 2012-11-30T11:31:16.887 に答える
0

あなたのコードは で 1 回だけ実行され$(document).ready();ます。.change()イベント ハンドラーでラップします。

$("select[name='menu-168']").change(function(e) {
    if ($(this).val() == "Commercial") {
        $("#added_fields").addClass("hidden");
    }
});​

更新されたフィドル: http://jsfiddle.net/K9zGP/36/

アップデート：

jsfiddle.net/K9zGP/46 でテキスト入力を再表示するには、.toggleClass()代わりに次を使用します。

$("select[name='menu-168']").change(function(e) {
    var isCommercial = $(this).val() == "Commercial";
    $("#added_fields").toggleClass("hidden", isCommercial);
});​

YAF: http://jsfiddle.net/K9zGP/71/

于 2012-11-30T11:34:44.373 に答える
0

これを試して ：

$("select[name='menu-168']").change(function() {

if ( $(this).val() == "Commercial") {
    $("#added_fields").hide();
}
});​
于 2012-11-30T11:35:09.437 に答える
0

これを試して：

$("select").change(function(){
if($("select option:selected").val() == "Commercial") 
$("input[name=text-708]").hide();
else
$("input[name=text-708]").show();   
});

デモ

于 2012-11-30T11:35:59.317 に答える