我对jQuery很陌生。以前从未真正使用过它。我的复选框有这个 HTML 截图:
<h4>Caterories</h4>
<ul>
<fieldset id="events">
<li>
<input name="" type="checkbox" value="annual" checked="checked" />
Annual Events</li>
<li>
<input name="" type="checkbox" value="business" checked="checked"/>
Business Development, Marketing & Management</li>
<li>
<input name="" type="checkbox" value="enviro" checked="checked"/>
Environment, Health & Safety</li>
<li>
<input name="" type="checkbox" value="hr" checked="checked"/>
Human Resources</li>
<li>
<input name="" type="checkbox" value="it" checked="checked"/>
Information Technology</li>
<li>
<input name="" type="checkbox" value="trans" checked="checked"/>
Transportation</li>
</fieldset>
</ul>
我有我的jquery截图:
<script language="JavaScript">
$(document).ready(function() {
$(".topnav").accordion({
accordion:'true',
speed: 500,
closedSign: '',
openedSign: ''
});
$("events").click(function(){
alert("HI");
var pClass = '.'+$(this).val();
if ($(this).is(':checked')) {
$(pClass).fadeIn();
$(pClass).show();
} else {
$(pClass).fadeOut();
$(pClass).hide();
}
})
});
</script>
有一个与复选框类别对应的事件列表:
<div class="news_box hr">
<div class="date">01<br />
Jan.<br /><br>
</div>
<div class="news_box annual">
<div class="date">02<br />
Jan.<br /><br>
</div>
<div class="news_box it">
<div class="date">12<br />
Jan.<br /><br>
</div>
<div class="news_box hr">
<div class="date">20<br />
Jan.<br /><br>
</div>
恐怕我的点击功能在错误的地方,它不是由复选框检查触发的。有什么建议吗?
更改:
$("events").click(function(){
自:
$("#events input:checkbox").click(function(){
注意:"事件"前面的点正确表示 ID。
更新
这样做更合适:
$("#events input:checkbox").on('click', function(){ ...
参见:.on('click') 与 .click() 之间的区别
$("#events > li > input").click(function(){
// Your code
})
或者,您可以为每个输入字段添加类并直接分配单击功能。
$(".inputclass").click(function(){
// Your code
})