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更改类的可见性

回答

相关问题