Onclick更改類的可見性

我有一系列按鈕和UL，其中所有列表項都具有內聯樣式的顯示：無。Onclick更改類的可見性

當用戶點擊一個按鈕時，我想讓某個類的任何LI都可見。舉個例子，我的代碼（！完成與非功能jQuery的）看起來像：

<script> 
$(document).ready(function() { 
    $('.countrySelect').click(function() { 
     $(.Canada) 
     .css('display','block') 
    }); 
}); 
</script> 

<button type="button" class="countrySelect" name="United-Kingdom">UK</button> 
<button type="button" class="countrySelect" name="European-Union">EU</button> 
<button type="button" class="countrySelect" name="Canada">Canada</button> 

<ul> 
    <li><span class="United-States Hosted">Amazon Flexible Payment System</span></li> 
    <li><span class="United-States Hosted">Amazon Simple Pay</span></li> 
    <li><span class="United-States Canada Onsite">Authorize.net</span></li> 
</ul>

來源

2013-03-28 YourFriendJosh

需要大約.Canada報價是這樣的：'$（「加拿大」）' –

$('.countrySelect').click(function() { 
     $(".Canada").css('display','block'); 
    });

read more關於jQuery選擇

來源

2013-03-28 18:45:20 XTop

他也可以用$（」加拿大'）。隱藏（）;或$（'。Canada'）。fadeOut（）; –

我一直使用這個。這也適用於更改任何CSS屬性。 –

@ClaudioLudovicoPanetta你可以使用'$（'。Canada'）。hide（）; $（'。Canada'）。fadeOut（）;'as as .. they are perfectly fine; – XTop

試試這個：

$(document).ready(function() { 
    $('.countrySelect').click(function() { 
     $(".Canada").show(); 
    }); 
});

您需要各地報價選擇器，你可能會發現show（）比較簡單（尤其是因爲<span>標籤顯示：默認爲內聯，而不是display：block）。

來源

2013-03-28 18:47:10 jszobody

這裏您錯過了與.Canada的報價。試試這樣：

$(document).ready(function() { 
    $('.countrySelect').click(function() { 
     $('.Canada').css('color','red') 
    }); 
});

這裏是工作示例：http://jsfiddle.net/SrpVG/

來源

2013-03-28 18:51:03

Onclick更改類的可見性

回答

相關問題