jquery操作checkbox示例分享,jquerycheckbox示例
jquery操作checkbox示例分享,jquerycheckbox示例
checkbox操作
1. 全选、全不选
2.打印所有的选中项目
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> </title> <script type="text/javascript" src="jquery-1.3.2.js"></script> <script> // 全选、全不选 function docChkBoxChange(){ var isChecked = jQuery('#docChkBoxTop').attr('checked'); // 设置以下所有的 checkBox 列表 jQuery("input[name=docChkBox]").each(function(){ this.checked = isChecked; }); }//end function // 打印所有的选中项目 function printChoose(){ var isChecked = jQuery('#docChkBoxTop').attr('checked'); // 设置以下所有的 checkBox 列表 jQuery("input[name=docChkBox]").each(function(){ if(this.checked){ alert(this.value) } }); }//end function </script> </head> <body> <table> <tr> <td> <input id='docChkBoxTop' type="checkbox" onClick='docChkBoxChange()'>全选、全不选 </td> </tr> <tr> <td> <input name='docChkBox' type="checkbox" value='apple'>苹果 </td> </tr> <tr> <td> <input name='docChkBox' type="checkbox" value='banana'>香蕉 </td> </tr> <tr> <td> <input type="button" value='打印所有选中项' onClick='printChoose()'> </td> </tr> </table> </body> </html>
你的思路是正确的
var tableA = ['aa', 'bb', 'cc', 'dd'], tableB = ['aa', 'cc'], i = 0, len = tableA.length;for(; i<len; i++){ var index = $.inArray(tableA[i], tableB); if(index !== -1){ // 此处为思路代码,在这里面选中对应checkbox即可 tableB[index].check = checked }}
你把checkbox放到li的里面,li的事件传递给了checkbox,点击checkbox的时候,其实是点击了li,所以布局有问题<!DOCTYPE html><html><head><meta charset=utf-8 /> <title>test</title> <script src="jquery1.8/jquery-1.8.0.min.js"></script> <script language="javascript" type="text/javascript"> jQuery(function(){ $('ul.classname li span').click(function() { var ck = $(this).prev(); ck.prop("checked", !ck.prop("checked"));}).hover( function () { $(this).css("cursor", "pointer");} ); });</script><body><ul class="classname"><li rel="1"><input name="keyword" type="checkbox" id="keyword" value="北京" /><span>北京</span></li><li rel="X"><input name="keyword" type="checkbox" id="keyword" value="XX" /><span>XX</span></li></ul></body></html>
相关内容
- jquery实现保存已选用户,jquery实现用户
- jquery显示隐藏input对象,jqueryinput对象
- JQuery中$(document)是什么意思有什么作用,jquerydocument
- 一个简单的jQuery计算器实现了连续计算功能,jquery计算
- 关于jQuery判断元素是否存在的问题示例探讨,jquery示例
- jquery中的常用事件bind、hover、toggle等示例介绍,jquery
- js正则判断非法字符限制输入,js字符
- 一个小例子解释如何来阻止Jquery事件冒泡,阻止jquery事
- jQuery中attr()和prop()在修改checked属性时的区别,jqueryat
- jQuery新的事件绑定机制on()示例应用,jqueryon
评论关闭