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

获取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.…
上一篇讲到:第一次点击全选按钮input显示对勾,第二次则不显示,需要用prop来添加checked属性. 但是用prop会出现一个问题,对勾显示,而checked属性不会被添加(比如:$("input[type='checkbox'][name='che']").attr("checked") 获取结果为undefined),这样就无法通过if语句判断是否选中,从而实现反选功能. 我们先来理一下思路:既然“反选”功能的实现是通过判断是否有checked属性,所以当…
最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectAll(obj){ $('input[name="xxx[]"]').attr("checked",obj.checked); } <input type="checkbox" id="mother" name="m…
一.样式操作 1.JQ中的样式类 somenode.addClass();// 添加指定的CSS类名. somenode.removeClass();// 移除指定的CSS类名. somenode.hasClass();// 判断样式存不存在 somenode.toggleClass();// 切换CSS类名,如果有就移除,如果没有就添加. somenode.className 获取所有样式类名(字符串) somenode.classList 获取所有样式类名(数组) somenode.clas…
<%@ page language="java" contentType="text/html; charset=utf-8"     pageEncoding="utf-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">&…
JQuery1.6以后,Prop的出现,让1.6以下的全选反选效果全部失效了.以下是修正后的版本: 全选反选效果: $(".checkbox").click(function () { $('input[type=checkbox]').prop('checked', $(this).prop('checked')); }); 找到选中项的JQ代码: $("input:[type='checkbox'][checked]") JQ1.6以下的全选反选效果: if (…
<input id="Chk_All" onclick="CheckAll()" type="checkbox" /> <input name=\"al\" id=\"" + item["WH"].ToString() + "\" acttype=\"info\" type=\"checkbox\" />…
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content=""> <meta name="Author" content=""> <meta name="Keywords&…
引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Title</title> </head> <body> &l…
特色: 1.在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备 2.支持触摸设备 — iOS.Android.BlackBerry.Windows Phone等系统 4.方便定制 — 用HTML 和 CSS 即可为其设置样式 (多套皮肤) 5.体积小巧 — gzip压缩后只有1 kb 6.25 种参数 用来定制复选框(checkbox)和单选按钮(radio button) 7.8 个回调事件 用来监听输入框的状态 8.7个方法 用来通过编程方式控制输入框的状态 9.能…
全选反选checkbox在实际应用中比较常见,本文有个不错的示例,大家可以参考下 操作checkbox,全选反选//全选 function checkAll() { $('input[name="TheID"]').attr("checked", "checked"); } //反选 function uncheckAll() { $('input[name="TheID"]').each(function() { this.…
操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked", "checked"); } //反选 function uncheckAll() { $('input[name="TheID"]').each(function() { this.checked = !this.checked; }) } //获取选中的项 f…
书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选反选插件</title> <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/…
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body><ul id="list"> <li><label><input type="checkbox"…
--获取选中值 var pList = ""; $("[name='ckdProd']").each(function () { if ($(this).is(':checked')) { pList += $(this).val() + ","; } }); --全选反选 $("#ckAll").click(function () { $("[name='Ck.Date']").prop("ch…
总选框:<input type="checkbox" class="all" name="all"> 子选框: <input class='sel' type='checkbox' name='test' value=""> /** * 全选 反选 */ $(".all").bind("click",function(){ $(".sel").…
// 全选 反选 allChoose: function (o) { var obj = $.extend(true, { id: "#id", name: "name", allSelection: true, invertSelection: true }, o); var $id; if (obj.id.substring(1) === "#") { $id = obj.id; } else { $id = "#" +…
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>多选框全选/反选</title> <script src="http://res01.xesimg.com/jquery/jquery.min.js">&l…
//必须先加载jquery //加载 弹出框插件 artdialog http://www.planeart.cn/demo/artDialog/ /****全选反选*开始**/ $(document).ready(function(){    $("input[name=checked_all]").click(function(){   var check_status = $(this).attr('checked');   if(check_status == "ch…
(function($){ $.fn.check = function(options){ var options = $.extend({ element : "input[name='node']" },options); return this.each(function(){ var self = $(this); var elements = $(options.element); self.click(function(){ elements.each(function(i…
//全选 反选 $('#chkAll').on('click',function(){ $('input.chkbox').prop('checked',$(this).prop('checked')); }); $('input.chkbox').on('click',function() { $('input.chkbox:checked').length == $('input.chkbox').length ? $('#chkAll').prop('checked',true):$('#…
1. $('#tb:checkbox').each(function(){ 每次都会执行 全选-取消操作,注意$('#tb :checkbox').prop('checked',true); tb后面一定得有括号,否则会报错. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> &…
在前端中用到全选反选的案例并不少,在这里呢我就实现这个功能给大家参考参考. 这里呢就先贴上我的html和css代码 <div class="wrap"> <table> <thead> <tr> <th> <input type="checkbox" id="theadInp" /> </th> <th>快递</th> <th>…
<!-- author:青芒 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>多选/全选/反选 获取选中的值</title> </head> <body> <p>中国古代十大名剑</p> <input type="chec…
<!--第一层--> <div class="first"> <div class="first_top"> <img src="../img/chartor4.png" class="first-img" /> <input type="checkbox" name="resUuids" value="" id=…
//全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th><input type="checkbox" id="checkAll" name="checkAll" /></th>'); /*将全选/反选复选框添加到表头最前,即增加一列*/ $thr.prepend($checkAllT…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选反选</title> </head> <body> <input type="button" value="全选" id="all"> <input t…
以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也是用for循环遍历一遍,把复选框的值设为当前状态的反向: obox[i].checked=!obox[i].checked; .难点在于在全选状态下取消一个复选框,要自动识别为没有全选,随即更新全选状态为false. <html> <head> <meta charset=&qu…
我们经常会在网站上遇到一些多选的情况,下面我就来说说使用Dom写全选反选的思路. 全选思路:首先,我们来分析一下知道,当我们点击"全选"复选框的时候,所有的复选框应该都被选中,那我们就可以给"全选"复选框注册一个事件,就是如果全选按钮被选中的话,那么其他所有复选框都被选中:然后就是其他复选框部分选中或全不选中,那么"全选"复选框不选中. 反选思路:我们知道,当我们点击反选按钮,那么就把除"全选"之外的所有复选框的选中状态取反(…
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>javascript checkbox全选 反选 全不选</title> <meta name="des…