最近做了很多前端页面的工作,遇到的一个感觉很头疼的问题在这里记一下:

  经常用JS回显单选框,但是明明从页面效果上来看,单选框已经被选中了,可是却不能触发单选框的change事件,取值的时候用某种方法取不能取的选中单选框的值(单选框取值有很多种方法,我的意思是有的能够取到,有的方法取不到)。

  想了很久,整理出一套看起来很复杂却非常实用的JS回显方法。试验了多种前端框架和浏览器,均好使。假设我们需要给name为gender,value为1的单选框进行回显:

  $("[name='gender'][value=1]").attr("checked", "checked").prop("checked", true).trigger("change");

  attr和prop可以保证任何获取选中单选框的值的方法都可以获得,trigger方法手动触发单选框的change事件。如果你的单选框的事件是其他事件,只需要将change变成相应的事件即可。

JS实现单选按钮回显时页面效果出现,但选中单选框的值为空的更多相关文章

  1. js获取单选框的值

    js获取单选框的值 var lx= $("input[name='lx']:checked").val();

  2. SpringMVC+HibernateValidator,配置在properties文件中的错误信息回显前端页面出现中文乱码

    问题: 后台在springMVC中使用hibernate-validator做参数校验的时候(validator具体使用方法见GOOGLE),用properties文件配置了校验失败的错误信息.发现回 ...

  3. vue-quill-editor回显时移除焦点

    直接复制开用 解决在回显数据的时候会默认聚焦 this.$refs.myQuillEditor.quill.enable(false); setTimeout(() => { this.$ref ...

  4. EasyUI-combotree 下拉树 数据回显时默认选中

    组合树(combotree)把选择控件和下拉树结合起来.它与组合框(combobox)相似,不同的是把列表替换成树组件.组合树(combotree)支持带有用于多选的树状态复选框的树. 依赖 comb ...

  5. js实现上传图片回显功能

    用到h5技术 <img id="headimg" src="<%=path%>/resources/images/icon4.png" sty ...

  6. js 上传图片进行回显

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. js select 默认回显判断

    <select id="dataselect" class="input-medium" style="width: 20%"> ...

  8. checkbox后台传个list显示和回显的页面代码C标签

        <c:forEach items="${listtest}" var="provinces">        <input type= ...

  9. 最完美解决方案:js弹出窗口关闭当前页面,而不弹出提示框

    该功能主要用于业务系统中的登录操作,登录后弹出全屏的业务系统主界面,而不需要工具栏.地址栏.菜单等功能. 之前针对不同浏览器找了无数种方法,包括网上能查到的所有方法,弹出的结果都不理想.结果有的IE6 ...

随机推荐

  1. 开启tomcat的apr模式,并利用redis做tomcat7的session的共享。

    更新系统组件 yum -y install readline* xmlto kernel-devel yum* screen vim* psmisc wget lrzsz pcre-devel lib ...

  2. 如何在yarn上运行Hello World(二)

      在之前的一篇文章我们介绍了如何编写在yarn集群提交运行应用的AM的yarnClient端,现在我们来继续介绍如何编写在yarn集群控制应用app运行的核心模块 ApplicationMaster ...

  3. C#保留2位小数的做法

    第一 算法实现           保留两位的话,就用一个浮点型先乘以100,然后取整,取整完了之后,再乘以1.0,然后再除以100.          上面这种做法是保留n位,不会四舍五入的.因为这 ...

  4. Ruby学习之动态调用

    作为一个动态语言,对象中的方法不会像静态语言一样需要验证确实存在,动态语言的对象之间一直保持着交谈,如果你调用一个不曾定义过的方法,程序也不会马上就报错而无法运行,只有当运行到你调用这个方法时,解释器 ...

  5. [Android游戏开发]游戏框架的搭建

    通常情况下,游戏开发的基本框架中,一般包括以下模块: 窗口管理(Window management):该模块负责在Android平台上创建.运行.暂停.恢复游戏界面等功能. 输入模块(Input):该 ...

  6. Fiddler中Response 的Raw乱码问题解决

    有时候我们看到Response中的HTML是乱码的, 这是因为HTML被压缩了, 我们可以通过两种方法去解压缩. 1. 点击Response Raw上方的"Response body is ...

  7. SQL语言的分类

    本文转自https://www.cnblogs.com/fjfzhkb/archive/2007/10/18/929108.html SQL语言共分为四大类:数据查询语言DQL,数据操纵语言DML, ...

  8. 用Python让单片机“行动”起来——MicroPython实战入门篇

    MicroPython以微控制器作为目标,从而使得Python可以用来控制硬件.说到MicroPython,也许有人会感到陌生.而说到和它密切相关的Python,是否会恍然大悟呢?Python属于解释 ...

  9. IOS 看懂此文,你的block再也不需要WeakSelf弱引用了!

    前言: 最近都在折腾 Sagit 架框的内存释放的问题,所以对这一块有些心得. 对于新手,学到的文章都在教你用:typeof(self) __weak weakSelf = self. 对于老手,可能 ...

  10. Java学习笔记8(面向对象一:概念、private)

    面向过程的思想:遇到问题,想,我该怎么解决这个问题?然后一步一步解决 面向对象的思想:遇到一件事的时候,思考,我该让谁来做,至于他怎样去做,不是我需要考虑的事情,只要最后做好就行 实际举例:我们要组装 ...