使用 jquery 显示/隐藏具有特定类的内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7865964/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Show/hide content with specific class using jquery
提问by user1009453
I'am new to jquery and maybe this is a stupid question but I have searched for an answer just about everywhere without finding one. So, here we go:
我是 jquery 的新手，也许这是一个愚蠢的问题，但我几乎到处都在寻找答案却没有找到。所以，我们开始：
I want to show different content depending on what option I select in a drop down form. As I have learnt here on StackOverflow, you ca use the change function to do this:
我想根据我在下拉表单中选择的选项显示不同的内容。正如我在 StackOverflow 上学到的，你可以使用 change 函数来做到这一点：
Example:
例子：
<script type="text/javascript">
$(document).ready(function() {
$('#myselector').change(function(){
$('.statecontent').hide();
$('#' + $(this).val()).show();
});
});
</script>
<select id="myselector">
<option value="state1"></option><br />
<option value="state2"></option><br />
<option value="state3"></option><br />
</select>
<div id="state1" class="statecontent">State1 Specific Page Content Goes here</div><br />
<div id="state2" class="statecontent">State2 Specific Page Content Goes here</div><br />
<div id="state3" class="statecontent">State3 Specific Page Content Goes here</div><br />
This code will alove me to show content thats inside the different divs depending on what 'state' I choose in the drop down. But how do I connect the values of the drop down to a specific class instead of an id. The problem is of course that I want to show several divs that share a common class when i select a state in the drop down.
这段代码会根据我在下拉菜单中选择的“状态”来显示不同 div 中的内容。但是如何将下拉列表的值连接到特定的类而不是 id。问题当然是当我在下拉列表中选择一个状态时，我想显示几个共享一个公共类的 div。
I would very much appreciate if anyone could point me in the right direction.
如果有人能指出我正确的方向，我将不胜感激。
Paul
保罗
回答by Jayantha Lal Sirisena
you can use class instead of Id like this
你可以像这样使用 class 而不是 Id
<div class="statecontent state1">State1 Specific Page Content Goes here</div><br />
<div class="statecontent state1">State1 Specific Page2 Content Goes here</div><br />
<div class="statecontent state2">State2 Specific Page Content Goes here</div><br />
<div class="statecontent state3">State3 Specific Page Content Goes here</div><br />
and your JQuery
和你的 JQuery
$(document).ready(function() {
$('#myselector').change(function() {
$('.statecontent').hide();
$('.' + $(this).val()).show();
});
});
回答by ipr101
$('.classname')
selects a class, so -
选择一个班级，所以 -
$('.' + $(this).val()).show();
would work if the value in your drop down corresponded to a class name.
如果您的下拉列表中的值对应于一个类名，它将起作用。
回答by JB Nizet
Read a jQuery doc about selectors. $("#someId")selects the element havig someIdas id. $(".someClass")selects the elements having someClassas class. It uses the CSS3 notation. That's the heart of jQuery.
阅读关于选择器的jQuery 文档。$("#someId")选择元素havigsomeId作为id。$(".someClass")选择具有someClass作为类的元素。它使用 CSS3 表示法。这就是 jQuery 的核心。
回答by Chandu Right
$(document).ready(function () {
$(".col-md-12").load(function () {
$("module").removeClass("hidden");
});
