我有这个 html。
<tr>
<td width="75">Mon</td>
<td class="bn_time" width="60">
<input id="mon_open" name="mon_open" class="time" placeholder="opening time" />
</td>
<td class="bn_time" width="10" align="center">-</td>
<td class="bn_time" width="100">
<input id="mon_close" name="mon_close" class="time" placeholder="closing time" />
</td>
<td colspan="3" align="center" class="bn_holiday" hidden>Holiday</td>
<td>
<input type="checkbox" name="mon_closed" id="mon_closed" class="bn_closed" />
<label for="mon_closed">Closed</label>
</td>
</tr>
我想做的是对复选框add/remove' hidden attribute to
`元素使用更改事件。例如。
if ('#bn_closed').is(':checked') {
//hide all <td> element with class bn_time
//show <td> element with class bn_holiday
} else {
//show all <td> element with class bn_time
//hide <td> element with class bn_holiday
}
这就是我尝试使用 jQuery 做的事情。
$('.bn_closed').change(function() {
var element = $(this);
var id = element.attr('id');
var day = id.slice(0,-7);
var day_open = day+'_open';
var day_close = day+'_close';
if(element.is(':checked')) {
//hide all <td> element with class bn_time
//show <td> element with class bn_holiday
} else {
//show all <td> element with class bn_time
//hide <td> element with class bn_holiday
}
});
有一个重要的事情要注意,有多个元素具有相同的类名。我想修改只是兄弟姐妹元素的属性,而不是表中的所有元素。
谢谢你。