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

  经常用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. HTML基本功之文档结构

    项目名 首页 命名为 index.html 样式文件夹 命名为 css  /*用来放样式文件*/ base.css  /*基本样式*/ index.css /*首页样式*/ global.css /* ...

  2. Python-String字符串的相关方法

  3. ArrayList中对象 排序

    public class Student implements Comparable { private String studentname; public int studentage; publ ...

  4. 对 Java 集合的巧妙利用

    我们直接切入正题.首先大致介绍一下 Java 三大集合的一些特征: ①.ArrayList:底层采用数组结构,里面添加的元素有序可以重复. ②.HashSet:底层采用哈希表算法,里面添加的元素无序不 ...

  5. Spring之DAO二

    上一篇算是把JdbcDaoSupport的使用演示了一下,这篇主要是演示MappingSqlQuery.SqlUpdate.SqlFunction的使用以及Spring的事务管理. 一.Mapping ...

  6. 构建布局良好的Windows程序

    工具箱→菜单和工具栏菜单栏MenuStrip的类型MenuItem:菜单项TextBox:文本框ComboBoX:组合框Separato:分割线前面都有ToolStrip做前缀 Applaction. ...

  7. 房上的猫:HTML5基础

    一.W3C标准 1)W3C标准不是某一个标准,而是一系列的标准的集合,一个网页主要由三部分组成,即结构(Structure),表现(Presentation)和行为(Behavior) 2)不很严谨的 ...

  8. 在Ubuntu下安装OpenJDK的方法

    最近在看<深入理解Java虚拟机>就想试一下在ubuntu下安装一个自己的虚拟机,说实话还是废了些功夫的. 首先我的ubuntu版本是Ubuntu 14.04.5, 于是我就去OpenJD ...

  9. vue2 vue-router 组装

    适用于vue cli搭建的项目 vue-router模块下载及记录到package.json中: npm i vue-router -D main.js中: import VueRouter from ...

  10. python重试装饰器的简单实现

    简单实现了一个在函数执行出现异常时自动重试的装饰器,支持控制最多重试次数,每次重试间隔,每次重试间隔时间递增. 最新的代码可以访问从github上获取 https://github.com/black ...