本文介绍了如何利用jQuery库轻松实现网页上的多选框的全选与反选功能，简化了用户操作并提升了用户体验。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){
$(':checkbox[name=cb]').each(function(){
$(this).click(function(){
if($(this).attr('checked')){
$(':checkbox[name=cb]').removeAttr('checked');
$(this).attr('checked','checked');
}
});
});
});
</script>
</head>
<body>
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
</body>
</html>
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){
$(':checkbox[name=cb]').each(function(){
$(this).click(function(){
if($(this).attr('checked')){
$(':checkbox[name=cb]').removeAttr('checked');
$(this).attr('checked','checked');
}
});
});
});
</script>
</head>
<body>
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
<input type="checkbox" name="cb" />
</body>
</html>
扫一扫
659
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
