Jquery动态操作checkbox
问题的由来:html页面中使用checkbox给新建用户授权,然后提交到后台服务器,完成给用户授权。用户授权完成之后,如果用户的权限发生改变管理员需要修改多个用户的权限或查看某用户的权限,点击不同的用户时就需要在checkbox中显示不同用户的权限信息,此时就需要动态的修改checkbox。

解决方法的探索:
首先,使用Jquery的attr对checkbox进行遍历,所有的checkbox都设置为false,未选择。
$('input[name="auth"]').each(function(){
$(this).attr("checked",false);
});
接下来,通过ajax传入用户名,得到json,并获取用户所拥有的权限模块,通过checkbox的value设置模块是否选择
$.ajax({
type:"post",
url:"demo",
daattype:"json",
data:{
type:"getright",
username:username
},
success:function(data){
var authObjs = eval("("+data+")");//解析json数据
if(authObjs.status === false){
}
else if(authObjs.status === true){
var authApps = authObjs.apps;
$.each(authApps,function(i,authApp){
$("input:checkbox[value='"+authApp+"']").attr('checked',true);
});
}
}
});
最终的结果不是很理想,第一次请求是可以的,如果我的权限只有第一和第二个,那么只有这两个勾选了;第二次换另一个人,他原本有四个权限,那么除了一和二其他两个被勾选,第三次再换一个人,他没有任何权限,也可以显示都未勾选;重点来了,如果再切换第一个或第二个人,那么显示都未勾选。
使用浏览器的调试功能会发现代码执行正确,但是checked属性却未改变。
解决办法:经过多方查证,attr和prop的使用是有不同的,如果前面代码的attr都修改为prop就可以完美的达到预期的效果,即选中某个人就可以显示某个人当前所拥有的权限。
在此给出attr和prop的区别(我认为比较简单的解释):
- 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法;
- 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
Jquery动态操作checkbox的更多相关文章
- IE7中使用Jquery动态操作name问题
问题:IE7中无法使用Jquery动态操作页面元素的name属性. 在项目中有出现问题,某些客户的机器偶尔会有,后台取不到前台的数据值. 然开发和测试环境总是不能重现问题.坑爹之处就在于此,不能重现就 ...
- 黄聪:JQUERY判断操作CHECKBOX选中、取消选中、反选、第二次无法选中的问题
用JQuery做CheckBox全选和反选的时候,遇到一个问题.当用JQ控制全选,全取消一次以后,再次点击全选,发现代码变了,但是CheckBox没有处于选中状态. $("#id" ...
- JQuery动态操作表格
新人,小白一枚,刚刚参加工作,所以会在这里记录一些遇到的问题. 最近要做的东西,是对一个表格动态的添加行,删除行,并且对表格中内容进行非空验证. <!DOCTYPE html> <h ...
- jquery动态操作元素
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- Jquery动态在td中添加checkbox
如图:想要在这个id为headId的<td>中,用jquery动态添加checkbox 代码如下 : data是我用ajax 从后台获取的数据,里面含有若干个user类,我想把所有的人名字 ...
- jquery操作checkbox方法(全选、全不选、至少选择一个、选择值/文本)
原文:http://blog.csdn.net/u014079773/article/details/52371382 在实际开发中我们经常操作checkbox,不仅仅要获得checkbox选中的值, ...
- jQuery动态对表格Table进行添加或删除行以及修改列值操作
jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...
- 解决jquery操作checkbox全选全不选无法勾选问题
最近在学习中使用jquery操作checkbox,使用下面方法进行全选.反选:$("input[name='checkbox']").attr("checked" ...
- jQuery操作CheckBox的方法(选中,取消,取值)
jQuery操作CheckBox的方法(选中,取消,取值). 代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional/ ...
随机推荐
- Java8-Function使用及Groovy闭包的代码示例
导航 定位 概述 代码示例 Java-Function Groovy闭包 定位 本文适用于想要了解Java8 Function接口编程及闭包表达式的筒鞋. 概述 在实际开发中,常常遇到使用模板模式的场 ...
- php常用函数time
string date( string format [, int timestamp] ) 参数 format 表示时间格式化的方式,可能的方式如下: 格式化方式 说明 Y ...
- Submit Text 快捷键总结
Ctrl+D : 选择单词,重复可增加选择下一个相同的单词Ctrl+F : 查找内容Ctrl+G : 跳转到指定行Ctrl+H : 替换 Ctrl+J : 合并行(已选择需要合并的多行时)Ctr ...
- weboffice控件使用不能嵌入网页
var s = ""s += "<object id=WebOffice1 height=586 width='100%' style='LEFT: 0px; TO ...
- cf 710 E Generate a String
题意: 开始你有数字$0$,你可以用代价$x$将该数字加$1$或减$1$(当$x > 0$时),或用代价$y$将该数字变为$2x$,那么问得到数字$n$所需的最少代价是多少. 数据范围$1 \l ...
- er
电子锁管理 设备管理 设备管理 信息编辑;回收 电子锁发放 电子锁初始化,发放 记录车辆在发车时使用的电子锁 电子锁开锁联系人管理 电子锁开锁联系人管理 根据订单路线中的投点,设置每个投递点的开锁联系 ...
- 挑战程序2.1.4 穷竭搜索>>深度优先搜索
深度优先搜索DFS,从最开始状态出发,遍历一种状态到底,再回溯搜索第二种. 题目:POJ2386 思路:(⊙v⊙)嗯 和例题同理啊,从@开始,搜索到所有可以走到的地方,把那里改为一个值(@或者 ...
- modprobe和lsmod命令配合使用
modprobe命令用于智能地向内核中加载模块或者从内核中移除模块. modprobe可载入指定的个别模块,或是载入一组相依的模块.modprobe会根据depmod所产生的相依关系,决定要载入哪些模 ...
- JS 拼接字符串数组
1.格式1 1.1例子 [ {name: '北京',value: Math.round(Math.random()*1000)}, {name: '天津',value: Math.round(Math ...
- Excel 2007 批量删除隐藏的文本框
该方法取自百度知道,该朋友给出函数,我详细写一下方法. 打开有文本框的excel文件. 按 Alt+F11 打开编辑器. 将下面的函数复制进去: Sub deltxbox()Dim s As Shap ...