获取js dom原生属性的时候最好用prop()方法,获取自己添加的属性时用attr()

原文:http://blog.sina.com.cn/s/blog_bf5ce8cc0102vuyt.html

判断是否选中

代码如下:

$('#checkbox').prop('checked')

设置选中与不选中状态:

代码如下:

$('#checkbox').attr('checked',true)$('#checkbox').attr('checked',false)

但此方法在jquery1.9.1中,有些处理不一样

IE10,Chrome,FF中,对于选中状态,第一次$('#checkbox').attr('checked',true)可以实现但是当通过代码清除选中,下次再通过代码 $('#checkbox').attr('checked',true) 去选中时虽然代码中有checked='checked',但是画面表现都没有打勾。IE8,IE6下无此问题。

后来查询了相关的资料,发现现在attr('checked',true)都换成prop('checked',true);

jquery1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值。

大家都知道有的浏览器只要写disabled,checked就可以了,而有的要写成disabled = "disabled",checked="checked",比如用attr("checked")获取checkbox的checked属性时选中的时候可以取到值,值为"checked"但没选中获取值就是undefined。

jq提供新的方法“prop”来获取这些属性,就是来解决这个问题的,以前我们使用attr获取checked属性时返回"checked"和"",现在使用prop方法获取属性则统一返回true和false。

那么,什么时候使用attr(),什么时候使用prop()?1.添加属性名称该属性就会生效应该使用prop();2.是有true,false两个属性使用prop();3.其他则使用attr();项目中jquery升级的时候大家要注意这点!

以下是官方建议attr(),prop()的使用:

attr()与prop()之全选、反选问题的更多相关文章

  1. 关于input全选反选恶心的异常情况

    上一篇讲到:第一次点击全选按钮input显示对勾,第二次则不显示,需要用prop来添加checked属性. 但是用prop会出现一个问题,对勾显示,而checked属性不会被添加(比如:$(" ...

  2. 关于JQuery全选/反选第二次失效的问题

    最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectA ...

  3. jQuery之标签操作和返回顶部、登录验证、全选反选、克隆示例

    一.样式操作 1.JQ中的样式类 somenode.addClass();// 添加指定的CSS类名. somenode.removeClass();// 移除指定的CSS类名. somenode.h ...

  4. jQuery实现全选/反选和批量删除

    <%@ page language="java" contentType="text/html; charset=utf-8"     pageEncod ...

  5. Jquery 1.8全选反选删除选中项实现

    JQuery1.6以后,Prop的出现,让1.6以下的全选反选效果全部失效了.以下是修正后的版本: 全选反选效果: $(".checkbox").click(function () ...

  6. checkbox、全选反选,获取值

    <input id="Chk_All" onclick="CheckAll()" type="checkbox" /> < ...

  7. jQuery全选/反选checkbox

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  9. BootStrapt iCheck表单美化插件使用方法详解(含参数、事件等) 全选 反选

    特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便 ...

随机推荐

  1. leetcode-219-Contains Duplicate II(使用set来判断长度为k+1的闭区间中有没有重复元素)

    题目描述: Given an array of integers and an integer k, find out whether there are two distinct indices i ...

  2. Laravel5.5 引入并使用第三方类库操作

    理论上,Laravel5系列都支持,各位可以一试.我这里使用5.5版本. 我这里引入了一个将汉字转化为拼音的类库测试,一起来看看吧! 首先,在laravel的app目录下自定义一个文件夹,我用的名字是 ...

  3. 2016级算法期末上机-E.中等·ModricWang's Fight with DDLs II

    1125 ModricWang's Fight with DDLs II 思路 圆内被划分部分数的计算方式如下: 圆内部的每一个交点都使得总份数增加了一:除此之外,每一根直线段最后抵达圆周时,总份数也 ...

  4. linux中pipe和dup2详解

    1.什么是管道 管道是半双工的,数据只能向一个方向流动:需要双方通信时,需要建立起两个管道: 只能用于父子进程或者兄弟进程之间(具有亲缘关系的进程): 单独构成一种独立的文件系统:管道对于管道两端的进 ...

  5. 社区发现SLPA算法

    社区(community)定义:同一社区内的节点与节点之间关系紧密,而社区与社区之间的关系稀疏. 设图G=G(V,E),所谓社区发现是指在图G中确定nc(>=1)个社区C={C1,C2,..., ...

  6. [Alpha]Scrum Meeting#5

    github 本次会议项目由PM召开,时间为4月7日晚上10点30分 时长10分钟 任务表格 人员 昨日工作 下一步工作 木鬼 撰写博客目录 整理清明开会记录 SiMrua 模型再训练(issue#1 ...

  7. dwz+ssh Http status: 200 OK

    问题描述,用超链接跳转页面的时候报这个错,原因是超链接的target没有设置对, 跳转页面应该用 target="navTab", 我原先用 target="navTab ...

  8. golang (5) http 请求分析

    http 分析包分析 fmt.Println("get Content-Type: ", r.Header.Get("Content-Type")) var r ...

  9. 【运维】centos7+confluence5.6.6破解

    一.安装mysql数据库 centos7自带mariadb数据库,因为无法下载完整安装包,最终选择将其完全卸载,然后全新安装mysql数据库 1.卸载mariadb rpm -qa | grep ma ...

  10. C# TCPClient简单示例

    示例使用方法参考 示例 以下一个简单的异步事件TCP客户端实现 using Newtonsoft.Json; using Newtonsoft.Json.Linq; using System; usi ...