我有一个2012年的日期选择器& 2013.根据选择,我想只显示具有某些类的行。有人可以告诉我哪里出错了吗?
的jQuery
<script>
$(document).ready(function() {
$(".yr12 td").hide();
$('#selectYr').change(function () {
var val = $(this).val();
if (val == yr12) {
$('.yr12 td').show();
$('.yr13 td').hide();
} else {
$('.yr12 td').hide();
$('.yr13 td').show();
}
});
});
的 HTML
<select id="selectYr">
<option value="yr13">2013</option>
<option value="yr12">2012</option>
</select>
<br><br>
<table>
<tr>
<th>Date</th>
<th>Description</th>
</tr>
<tr class="yr13">
<td>February 2013 </td>
<td>Description 1</td>
</tr>
<tr>
<td class="yr13">January 2013</td>
<td>Description 2</td>
</tr>
<tr class="yr12">
<td>November 2012</td>
<td>Description 3</td>
</tr>
<tr class="yr12">
<td>December 2012</td>
<td>Description 4</td>
</tr>
</table>
答案 0 :(得分:5)
你错过了字符串周围的引号:
if (val == 'yr12') { }
// ^ ^
答案 1 :(得分:1)
您正在尝试将val与另一个名为yr12的变量进行比较,而不是将其与值'yr 12'进行比较
这是正确的代码:
$(document).ready(function() {
$(".yr12 td").hide();
$('#selectYr').change(function () {
var val = $(this).val();
if (val == 'yr12') {
$('.yr12 td').show();
$('.yr13 td').hide();
} else {
$('.yr12 td').hide();
$('.yr13 td').show();
}
});
});
答案 2 :(得分:1)
两件事......
1 - &gt;
<tr>
<td class="yr13">January 2013</td>
应该是
<tr class="yr13">
<td>January 2013</td>
2 - &GT;
if (val == "yr12") {