需要修改Javascript
需要修改Javascript
提问于 2011-04-20 02:44:36
我需要能够检查某个字符串的类值。该类可以有多个用逗号分隔的值。需要修改代码，这样当选择West时，除了class值中包含West的行之外，所有内容都会消失。示例：
<tr class="West"></tr> (shows up)
<tr class="West,NE"></tr> (shows up)
<tr class="NE"></tr> (doesn't show)javascript
<script type="text/javascript">
$(document).ready(function(){
var links = $('#lb01'),
regions = $('.West,.NE,.Southeast,.East,.South,.Central,.Northeast,.HO,.National,.US,.Texas,.Mid-Central');
regions.not('.West').hide();
links.change(function(event) {
regions.hide().filter('.' + this.options[this.selectedIndex].id).show();
});
});
</script>html
<div class="tabset">
<div id="tab1" class="tab-box">
<div class="form-holder">
<form action="#">
<fieldset>
<label for="lb01"><strong>Choose District:</strong></label>
<select id="lb01">
<option class="bound" id="West">WEST</option>
<option class="bound" id="NE">NE</option>
<option class="bound" id="Southeast">SOUTHEAST</option>
<option class="bound" id="East">EAST</option>
<option class="bound" id="South">SOUTH</option>
<option class="bound" id="Central">CENTRAL</option>
<option class="bound" id="Northeast">NORTHEAST</option>
<option class="bound" id="HO">HO</option>
<option class="bound" id="US">US</option>
<option class="bound" id="Mid-Central">Mid-Central</option>
<option class="bound" id="Texas">Texas</option>
</select>
</fieldset>
</form>
</div>
<div class="report-box">
<table>
<thead>
<tr>
<td class="name">Name</td>
<td class="department">Department</td>
<td class="title">Title</td>
<td class="district">District</td>
<td class="profile"> </td>
</tr>
</thead>
<tbody>
<tr class="West,NE,Southeast">
<td>Name1</td>
<td></td>
<td></td>
<td></td>
<td><a class="btn-profile" href="#">PROFILE</a></td>
</tr><tr class="West">
<td>Name2</td>
<td></td>
<td></td>
<td></td>
<td><a class="btn-profile" href="#">PROFILE</a></td>
</tr><tr class="East">
<td>Name3</td>
<td></td>
<td></td>
<td></td>
<td><a class="btn-profile" href="#">PROFILE</a></td>
</tr>回答 2
Stack Overflow用户
回答已采纳
发布于 2011-04-20 02:53:04
首先，你的class属性中不应该有逗号。类是以空格分隔的
<tr class="West NE"></tr>现在，您只需在change函数中执行以下操作：
links.change(function(event) {
$('.report-box tr').hide().find('.' + this.value).show();
});Stack Overflow用户
发布于 2011-04-20 02:58:23
对于初学者来说，不要用逗号分隔类名。如果你所拥有的东西不起作用，这可能就是罪魁祸首。
这里有一种替代方法：
$(document).ready(function() {
var $links = $('#lb01');
$(".report-box tbody tr").hide();
$('tr.West').show();
$links.change(function(event) {
var region = $(this).find(":selected").attr("id");
alert(region);
$(".report-box tbody tr").hide();
$(".report-box tbody tr." + region).show();
});
});工作示例：http://jsfiddle.net/hunter/thz99/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/5721112
复制相关文章
相似问题
腾讯云开发者
