3

ここで問題があります。ドロップダウン ボックスで選択した内容に応じて、特定のフィールドを表示しようとしています。私はスタックを見て、ここでコードを編集しようとしました： http://jsfiddle.net/tarleton/p8ARq/15/ 私のもので動作するように。助けていただければ幸いです。

$("select").change(function () {
    // hide all optional elements
    $('.optional').css('display','none');

    $("select option:selected").each(function () {
        if($(this).name() == "test") {
            $('.test').css('display','block');
        } else if($(this).val() == "test2") {
            $('.test2').css('display','block');
        }
    });
});

HTML:

<form class="contact" name="contact" action="#" method="post">
       <div id="styled-select">
           <select>
            <option name="test" value="Option 1" >Referral</option>
              <option name="test2"value="Option 2">Other</option>
              </select>
       </div>
          <input class="optional test" name="revealtest" style="display:none;" class="hidden-txt">

       <input class="optional other" name="revealtest2" value="" style="display:none;" class="hidden-txt">

</form>
4

3 に答える 3

1

.namejQueryにはありません。

使用できます.attr()

if($(this).attr('name')

または他のタグにclass適用できます。div

何を選択するかを以下のように指定し、

$('input.test2').css('display','block'); 
$('input.test').css('display','block');

classまた、すべてを単一のclass属性内にラップし、を使用して非表示にもしているinline styleため、削除します。jQuery.hide()

于 2013-03-26T03:29:39.640 に答える
0

これは私が思いついた解決策ですhttp://jsfiddle.net/burn123/p8ARq/34/

私が気づいた主なことは、あなたが持っていたということでしたstyle="display:hide". これはインライン スタイルなので、簡単には削除されません。要素optionalに秒を追加する不要なクラスもありました。display:noneだから私はそれらの両方を削除し、CSSをに設定しました

.other, .referral {
  display:none;
}

そのため、display一度だけ切り替えられました。あなたのjQueryはほとんどの場合問題ありませんでした。$(this).val()のように紹介を設定する必要がありましたother。また、else何か他のものを選択したときにテキストボックスを非表示にする場合は、エンディングが必要です. fadeToggle代わりにcss("display", "block")、少しトランジションを与えるためにも使用しました。おそらく、これを達成するためのより効果的なコードの方法がありますが、私はまだ jquery にかなり慣れていません ;)

これが役に立ったことを願っています

于 2013-03-26T03:38:10.073 に答える
0

jQuery を使用して、$("your_control").hide()またはを使用してすべてのコントロールを非表示にすることができます。jsFiddle$("your_control").show()でサンプルを更新するだけです。

于 2013-03-26T04:07:50.503 に答える