2

すべてのドロップダウンが「選択...」のデフォルト状態から変更されるまでリンクを非表示にする必要があるという要件があります。リンクは、3 つのドロップダウンすべてに選択が含まれなくなった後にのみ表示され、非表示にする必要があります。デフォルトの選択... が再選択された場合のリンク。

これは、最初の選択でのみ機能するが、選択をもう一度選択すると機能せず、他のドロップダウンメニューも無視するものを示すフィドルです。

$(document).ready(function() {
    $(".BuyButton").hide()
    $('.Option').change(function() {
        var str = $('.Option option:selected').text(); 
        if (str == "Select...") {
            $('.BuyButton').hide();
        } else {
            $('.BuyButton').show();
        }
    });   
});

ここでフィドル。

4

4 に答える 4

0

多くの回答がフラグメソッドを示しており、それは完全に有効ですが、別の方法を示すためだけです:

 $(document).ready(function () {
     $(".BuyButton").hide()
     $('.Option').change(function () {
         $(".BuyButton").css('display', ($('.Option option:selected').map(function (index, domElement) {return $(domElement).text();}).get().indexOf("Select...") != -1 ? 'none' : ''));
     });
 });

これは、すべてのオプション要素を取り、それらを配列にマップし、配列に「Select...」が含まれているかどうかを確認します。

于 2013-09-15T21:48:35.217 に答える
0

これは次のように行うことができます:

 $(document).ready(function () {
     $(".BuyButton").hide()
     $('.Option').change(function () {
         $(".BuyButton").css('display', ($('.Option:eq(0) option:selected').text() != "Select..." && $('.Option:eq(1) option:selected').text() != "Select..." && $('.Option:eq(2) option:selected').text() != "Select...") ? '' : 'none');
     });
 });

jsFiddle の例

選択の数が不明な場合は、これを使用できます。

 $(document).ready(function () {
     $(".BuyButton").hide()
     $('.Option').change(function () {
         var flag = false;
         $('.Option').each(function(){
             if($('option:selected',this).text()=="Select...") flag=true;;
         });
         $(".BuyButton").css('display',flag ? 'none':'');
     });
 });
于 2013-09-15T21:12:24.570 に答える
0

あなたはこれを試すことができます

$('.Option').change(function() {
    $('.BuyButton').css('display', function(){
       var o = $('.Option').filter(function(){ return this.selectedIndex == 0 });
       return o.length ? 'none' : '';
    });
});

デモ。

于 2013-09-15T21:47:36.313 に答える