propattr区别和用法,以多选框为例
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区别和用法,以多选框为例相关推荐
- 检查是否已使用jQuery选中复选框
如何检查是否使用复选框数组的ID选中了复选框数组中的复选框? 我正在使用以下代码,但是无论ID为何,它始终返回已选中复选框的数量. function isCheckedById(id) {alert( ...
- 8、Java Swing JCheckBox:复选框组件
一个复选框有选中和未选中两种状态,并且可以同时选定多个复选框.Swing 中使用 JCheckBox 类实现复选框, JCheckBox类的常用构造方法如下. JCheckBox():创建一个默认的复 ...
- java 复选框怎么用_Java Swing公开课|Java Swing的复选框组件怎么用,看完这篇文章你一定就会了...
[摘要]作为一门面向对象编程语言,Java吸收了C++语言的优点,也展现了其强大的一面,我们能在各个地方看到其功能强大和简单易用的两个特征,当然,也吸引了很多程序员的注意力,所以就有人想了解Java的 ...
- java中复选框组件_Java Swing JCheckBox:复选框组件
一个复选框有选中和未选中两种状态,并且可以同时选定多个复选框.Swing中使用 JCheckBox 类实现复选框,该类的常用构造方法如下.JCheckBox():创建一个默认的复选框,在默认情况下既未 ...
- selenium勾选复选框(单独勾选+全部勾选)
以新浪微博注册页面为例,勾选单个复选框:这里以勾选 '新闻' 复选框为例 代码思想:通过定位复选框的xpth,然后点击. #!/usr/bin/env python # -*- coding:utf- ...
- 实现翻页或查询后保持复选框勾选状态
首先先梳理一下复选框的相关逻辑 当你看着每个选项的名字而勾选选项时,传入后台的一定是这些选项所对应的id(即唯一的标识符).由于一个复选框的选项个数基本是不变的,在这个项目中所有的复选框的id和nam ...
- HTML中 单复选框的用法
今天看了看单复选框的用法,感觉很是好玩儿 ,所以赶快来把学会的分享下! 首先,在使用表单设计调查问卷时,为了减少用户的操作,使用选择框是一个不错的选择. HTML中有两种选择框,分别为单选框和复选框. ...
- easyui前端实现多选框_前端:Element UI 多选框组用法笔记
今天给大家分享一下Element UI 多选框组用法笔记,直接上代码! "兴趣爱好:"> "form.checkList"> for= {{item ...
- 前端:Element UI 多选框组用法笔记
今天给大家分享一下Element UI 多选框组用法笔记,直接上代码! <html><head></head><body><el-form> ...
最新文章
- @Accessors
- ​数字政府发展指数排名出炉!上海、浙江、北京位列前三,你的城市排第几?(附报告全文下载)...
- Python语言学习之常见语句命令那些事:python和常见语句命令(条件语句、pass语句)使用方法之详细攻略
- 工作流实战_27_flowable 自定义sql查询
- linux sed 正则转义,Linux运维云升笔记 (一)正则表达式以及文档编辑器sed
- IDEA引入外部jar包的方法
- 关于MySQL优化的几个问题
- OneAPM Cloud Test——系统性能监控神器 1
- Hadoop 高可用集群(HA)
- JAVA 设计模式 迭代器模式
- java孢子进化_孢子进化论游戏
- GsonFormat的使用 (转)
- Windows的文件目录管理策略
- chm打开空白(chm打开空白)
- C语言每日一练——第50天:八进制转十进制
- robots协议文件的几种写法及示例
- Julia REPL 模式
- 母亲大人辛苦了(snowfall.jquery实现爱心掉落)
- 快速设置Revit模型材质(Dynamo和API)
- zookeeper--ClientCnxn