jquery的attr获取表单checked 布尔值问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-1.11.3.js"></script>
<title>Document</title>
<script type="text/javascript">
$(function(){
$('#all').on('click',function(){
$('input:lt(4)').prop('checked',true);
//lt,gt是不包括临界的,
});
$('input:eq(5)').on('click',function(){
$('input:lt(4)').prop('checked',false);
}); $('#btn').click(function(){
var $att=$('input:checkbox').prop('checked');
// var $att=$('input:checkbox').attr('checked' 总是弹出undefined
// alert($att);
if($att==false){
// $('input[checked=true]').attr('checked',false);
$('input:checkbox').prop('checked',true);
}
else{
$('input:checkbox').prop('checked',false);
}
// $('[name=hobby]:checkbox').each(function(){
// this.checked=!this.checked;
// //赋相反的值。
// })
});
}); </script>
</head>
<body>
<form action="">
<label for='hobby'>你爱好的运动是</label><br>
<input type="checkbox" name="hobby" >足球
<input type="checkbox" name="hobby" >篮球
<input type="checkbox" name="hobby" >羽毛球
<input type="checkbox" name="hobby" >乒乓球<br>
<input type="button" value="全选" id='all'>
<input type="button" value="全不选">
<input type="button" value="反选" id='btn'>
<!-- <input type="button" value="提交"> -->
</form>
</body>
</html>
<!-- 问题关键是attr获取不到checked的属性值,总是弹出undefined ,后来发现要用prop来获取值
前面的全选和反选用attr来设置checked值时候只能够设置一次, 二用prop可以设置多次
-->
1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase
复制代码 代码如下: <input type="checkbox" id="selectAll" onclick="checkAll()">全选
function checkAll()
{
var checkedOfAll=$("#selectAll").prop("checked");
alert(checkedOfAll);
$("input[name='procheck']").prop("checked", checkedOfAll);
} 2.如果使用attr方法获取时,如果当前input中初始化未定义checked属性,则不管当前是否选中,$("#selectAll").attr("checked")都会返回undefined;
复制代码 代码如下: <input type="checkbox" id="selectAll" onclick="checkAll()" >全选 如果当前input中初始化已定义checked属性,则不管是否选中,$("#selectAll").attr("checked")都会返回checked.
复制代码 代码如下: <input type="checkbox" id="selectAll" onclick="checkAll()" checked>全选
function checkAll()
{
var checkedOfAll=$("#selectAll").attr("checked");
alert(checkedOfAll);
$("input[name='procheck']").attr("checked", checkedOfAll);
} 总结,如果使用jquery,应使用prop方法来获取和设置checked属性,不应使用attr.
jquery的attr获取表单checked 布尔值问题的更多相关文章
- javascript获取表单的各项值
何谓表单? 表单是html页面中负责数据采集功能的部件,它往往由三个部分组成: 表单标签:<form></form> 用于声明表单的范围,位于表单标签中的元素将被提交.属性有m ...
- jquery的attr禁用表单元素的方法
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- 获取表单的初始值,模拟placeholder属性
input和textarea有一个默认属性defaultValue,即初始值. 即使在页面操作修改了input和textarea的内容,获取到的defaultValue依然是初始值.可通过该值模拟pl ...
- jquery easyui将form表单元素的值序列化成对象
function serializeObject(form){ var o={}; $.each(form.serializeArray(),function(index){ if(o[this['n ...
- 使用js获取表单元素的值
function getParams(formName) { var frmMain = document.getElementById(formName)?document.getElementBy ...
- ionic获取表单input的值的两种方法
1.参数传递法 直接在input处使用 #定义参数的name值,注意在ts中参数的类型 html页面: <ion-input type="text" placeholder= ...
- JS获取表单元素的value
<!-- 1.option selected属性,如果我们在下拉列表里面选择了一个option那么他的selected="true" ,如果我们想设置当前的option是选中 ...
- JavaScript之控制表单元素的值
表单元素.value 获取表单元素的值 表单元素.value='这是修改后的值' 修改表单元素的值 案例: (1)html <input type="text" id=&qu ...
- 用jQuery获取表单的值
在日常开发过程中,有许多用到表单的地方.比如登录,注册,比如支付,填写订单,比如后台管理等等. 使用jQuery来获取表单的值是比较常见的做法. 常见表单 单行文字域:<input type=' ...
随机推荐
- Chrome 调试跨域问题解决方案之插件篇
跨域,就是A域名下的js,想请求B域名下的接口数据.跨域,只存在于浏览器端.App和小程序不存在跨域问题.跨域,分浏览器策略和服务器策略. 如果服务器配置了允许跨域,那就没有跨域问题 如果uni-ap ...
- nteract 使用教程
安装 直接去官网下载 一路回车 官网 建立python虚拟环境 和我们平时一样 不同的是在建立完之后 要安装一个kernel Using Python3 with pip and a virtual ...
- 数据科学工作者(Data Scientist) 的日常工作内容包括什么
数据科学工作者(Data Scientist) 的日常工作内容包括什么 众所周知,数据科学是这几年才火起来的概念,而应运而生的数据科学家(data scientist)明显缺乏清晰的录取标准和工作内容 ...
- git分布式版本控制系统权威指南学习笔记(二):git add暂存区的三个状态以及暂存区的理解
文章目录 不经过git add(到暂存区),能直接进行commit吗? 举个
- 1、获取APP 冷/热启动时间
最近在研究Android APP性能测试.所以发现一些有趣的东西,在这里进行分享.我们先讲第一个内容,如何获取APP冷/热启动时间?为什么要做这个测试,道理其实很简单,如果启动APP特别耗时的话,用户 ...
- 分析由Python编写的大型项目(Volatility和Cuckoo)
之前使用python都是用来做一些简单的脚本,本质上和bat批处理文件没有区别. 但是Python是可以用来编写大型的项目的,比如: Volatility:https://code.google.co ...
- 利用OpenFileDialog 获取图片存储到数据库中
private void button1_Click(object sender, EventArgs e) { string fName; ...
- struts基础
六个基本包 struts2-core-2.1.6.jar :开发的核心类库 freemarker-2.3.13.jar :struts2的UI标签的模板使用freemarker编写 commons-l ...
- 这是<一起找打的约定>的改良版本
-- CREATE TABLE class ( -- cid INT(25)auto_increment PRIMARY KEY, -- caption VARCHAR(50) not NULL -- ...
- what have we learnt in day five
what is file? virtual unit offered by operation system steps to open file 1.find the file_path(file_ ...