1.比较

  相同点 : prop和attr作为jquery的方法都可以获取属性值;

  不同点 : (1) 对于HTML元素本身就带有的固有属性,使用prop方法,

attr获取checkbox的checked属性时选中的时候可以取到值,值为"checked"但没选中获取值就是undefined。

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

(2)对于HTML元素我们自己自定义的DOM属性,使用attr方法 // 对于自定义的属性用prop方法取值和设置属性值时,都会返回undefined值

2.栗子

(1)

<script type="text/javascript" >
$(function(){
       var flag=false;
  $("#btn").click(function(){
  if(flag==false){
    $("#check").attr("checked",true);
    flag=true;
  }else{
    $("#check").removeAttr("checked");
    flag=false;
  }
  });

});

</script>

<input type="checkbox"   id="check" checked>
</br>
<input type="button" id="btn" value="btn btn">

//在第一次生效,勾选和取消之后就失效了,标签中一直显示checked="checked"

改用prop就可以了

if(flag==false){
    $("#check").prop("checked",true);
    flag=true;
  }else{
    $("#check").prop("checked",false);
    flag=false;
  }

(2) 使用原生js控制多选框的勾选状态

<script>
function checkAll() {
  var all=document.getElementById('all');//获取到点击全选的那个复选框的id
  var one=document.getElementsByName('checkname[]');//获取到复选框的名称
  if(all.checked==true){//因为获得的是数组,所以要循环 为每一个checked赋值
    for(var i=0;i<one.length;i++){
    one[i].checked=true;
    }

  }else{
    for(var j=0;j<one.length;j++){
    one[j].checked=false;
    }
  }
}
</script>

转载于:https://www.cnblogs.com/lizhiwei8/p/7682542.html

propattr区别和用法,以多选框为例相关推荐

  1. 检查是否已使用jQuery选中复选框

    如何检查是否使用复选框数组的ID选中了复选框数组中的复选框? 我正在使用以下代码,但是无论ID为何,它始终返回已选中复选框的数量. function isCheckedById(id) {alert( ...

  2. 8、Java Swing JCheckBox:复选框组件

    一个复选框有选中和未选中两种状态,并且可以同时选定多个复选框.Swing 中使用 JCheckBox 类实现复选框, JCheckBox类的常用构造方法如下. JCheckBox():创建一个默认的复 ...

  3. java 复选框怎么用_Java Swing公开课|Java Swing的复选框组件怎么用,看完这篇文章你一定就会了...

    [摘要]作为一门面向对象编程语言,Java吸收了C++语言的优点,也展现了其强大的一面,我们能在各个地方看到其功能强大和简单易用的两个特征,当然,也吸引了很多程序员的注意力,所以就有人想了解Java的 ...

  4. java中复选框组件_Java Swing JCheckBox:复选框组件

    一个复选框有选中和未选中两种状态,并且可以同时选定多个复选框.Swing中使用 JCheckBox 类实现复选框,该类的常用构造方法如下.JCheckBox():创建一个默认的复选框,在默认情况下既未 ...

  5. selenium勾选复选框(单独勾选+全部勾选)

    以新浪微博注册页面为例,勾选单个复选框:这里以勾选 '新闻' 复选框为例 代码思想:通过定位复选框的xpth,然后点击. #!/usr/bin/env python # -*- coding:utf- ...

  6. 实现翻页或查询后保持复选框勾选状态

    首先先梳理一下复选框的相关逻辑 当你看着每个选项的名字而勾选选项时,传入后台的一定是这些选项所对应的id(即唯一的标识符).由于一个复选框的选项个数基本是不变的,在这个项目中所有的复选框的id和nam ...

  7. HTML中 单复选框的用法

    今天看了看单复选框的用法,感觉很是好玩儿 ,所以赶快来把学会的分享下! 首先,在使用表单设计调查问卷时,为了减少用户的操作,使用选择框是一个不错的选择. HTML中有两种选择框,分别为单选框和复选框. ...

  8. easyui前端实现多选框_前端:Element UI 多选框组用法笔记

    今天给大家分享一下Element UI 多选框组用法笔记,直接上代码! "兴趣爱好:"> "form.checkList"> for= {{item ...

  9. 前端:Element UI 多选框组用法笔记

    今天给大家分享一下Element UI 多选框组用法笔记,直接上代码! <html><head></head><body><el-form> ...

最新文章

  1. @Accessors
  2. ​数字政府发展指数排名出炉!上海、浙江、北京位列前三,你的城市排第几?(附报告全文下载)...
  3. Python语言学习之常见语句命令那些事:python和常见语句命令(条件语句、pass语句)使用方法之详细攻略
  4. 工作流实战_27_flowable 自定义sql查询
  5. linux sed 正则转义,Linux运维云升笔记 (一)正则表达式以及文档编辑器sed
  6. IDEA引入外部jar包的方法
  7. 关于MySQL优化的几个问题
  8. OneAPM Cloud Test——系统性能监控神器 1
  9. Hadoop 高可用集群(HA)
  10. JAVA 设计模式 迭代器模式
  11. java孢子进化_孢子进化论游戏
  12. GsonFormat的使用 (转)
  13. Windows的文件目录管理策略
  14. chm打开空白(chm打开空白)
  15. C语言每日一练——第50天:八进制转十进制
  16. robots协议文件的几种写法及示例
  17. Julia REPL 模式
  18. 母亲大人辛苦了(snowfall.jquery实现爱心掉落)
  19. 快速设置Revit模型材质(Dynamo和API)
  20. zookeeper--ClientCnxn

热门文章

  1. poj1741 Tree 点分治
  2. Linux下mysql整库备份
  3. [导入]关于阶乘的两个常见算法及一个相关面试题
  4. Java 的单例模式
  5. 对于python 作用域新的理解
  6. 实战Vue简易项目(2)定制开发环境
  7. 揭开.NET 2.0配置之谜(一)
  8. 深入理解Elasticsearch(原书第2版)》一1.2 何为Elasticsearch
  9. JavaScript复制数组
  10. 安防监控产业链全景梳理