layui单选框radio使用form.render() 更新渲染失效的原因

使用layui做表单处理的时候需要多次切换radio的选中项,使用attr("checked","checked");后再使用form.render()更新渲染发现不生效,刚开始以为是form.render()渲染的问题,后来发现改成 prop('checked',true);就好了


//无效
$("input[name=sex][value='男']").attr("checked","checked");
form.render();
//生效
$("input[name=sex][value='男']").prop("checked",true);
form.render();

使用过程发现 $("input[name='sex']:eq(0)").attr("checked", 'checked'); 这种写法初始化赋值并加上form.render()是可以更新渲染的,但是如果多次切换的话会造成input的值切换成功,但是layui展示渲染失败(打印值是正确的,按钮显示没有切换过来),而改成prop设置属性值则多次更新也没有问题。

得出结论:

html 自带属性请用prop()方法,自定义属性用 attr() 方法,同时具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()
并且prop的属性值true,false请不要加"",如prop("checked","true");这种写法依旧不生效
同时可以使用prop设置多个属性

$("input[name=sex][value='男']").prop({"checked":false,"disabled":true});

原文作者技术博客:https://www.jianshu.com/u/ac4daaeecdfe

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • layui 常用操作 一、index(管理)页面 1.渲染数据表格 html: 修改 删除 js: tabl...
    名刀工一品阅读 3,081评论 0 0
  • 作为一个合格的开发者,不要只满足于编写了可以运行的代码。而要了解代码背后的工作原理;不要只满足于自己的程序...
    六个周阅读 12,692评论 1 33
  • It's a common pattern in React to wrap a component in an ...
    jplyue阅读 8,515评论 0 2
  • 前端开发面试题 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知...
    怡宝丶阅读 7,389评论 0 7
  • 目录 属性分为三种: js原生属性操作方法获取属性设置属性删除属性自定义数据属性 dataset获得自定义属性的值...
    顽皮的雪狐七七阅读 4,886评论 0 1