全选反选,随点击的复选框状态改变复选框的状态只读

一时失言乱红尘 2022-07-15 14:22 114阅读 0赞

<!DOCTYPE <html>  
</html>  
<html lang="en">  
<head>  
<script src="./jq.js"></script>  
<meta charset="UTF-8">  
<title>Document</title>  
</head>  
<body>  
<input type="checkbox" value="php">php  
<input type="checkbox" value="mysql">mysql<br>  
<input type="checkbox" value="apache">apache  
<input type="checkbox" value="checkbox" checked="checked">js  
<input disabled='disabled' type="checkbox" id='all' value="js">全选全不选复选框disabled='disabled'不可操作  
<button id="quan">全选</button>  
<button id="fan">反选</button>  
<button id="quanbu">全不选</button>  
</body>  
</html>  
<script>  
$('\#quan').click(function () \{  
$('input').prop('checked',true)  
\}),  
$('\#quanbu').click(function () \{  
$('input').prop('checked',false)  
\})  
$('\#fan').click(function () \{  
$('input').each(function (k,v) \{  
//console.log(k+v)  
if ($(v).prop('checked')==true)\{  
$(v).prop('checked',false)  
\}else\{  
$(v).prop('checked',true)  
\}  
\})  
\})  
//所有input标签中的checked属性的状态点击后$(this).is(":checked")判断被点击的状态如果是true则返回true 那么所有input的checked属性值都是true prop可重复使用  
$('\#all').click(function () \{  
$('input').prop('checked',$(this).is(":checked"))  
\})  
</script>

发表评论取消回复

表情：

评论列表（有 0 条评论，114人围观）

还没有评论，来说两句吧...

相关阅读

相关 js 实现复选框全选和反选

//全选 function chooseAll() \{ var selects = document.getElementsByName('id

深碍√TFBOYSˉ_/ 2022年08月26日 11:24/ 0 赞/ 190 阅读

相关 jQuery复选框全选反选操作

<!DOCTYPE html> <html > <head> <title> jquery-ajax </title> <sc

刺骨的言语ヽ痛彻心扉/ 2022年08月18日 12:09/ 0 赞/ 232 阅读

相关复选框的全选及其反选的实现

关键方法概述 prop() 方法设置或返回被选元素的属性和值。当该方法用于返回属性值时，则返回第一个匹配元素的值。当该方法用于设置属性值时，则为匹配元素集合设

忘是亡心i/ 2022年07月16日 07:09/ 0 赞/ 126 阅读

相关全选反选,随点击的复选框状态改变复选框的状态只读

<!DOCTYPE <html> </html> <html lang="en"> <head> <script src="./jq.js"></script>

一时失言乱红尘/ 2022年07月15日 14:22/ 0 赞/ 115 阅读

相关 js 复选框的多选反选

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR

r囧r小猫/ 2022年06月15日 12:50/ 0 赞/ 227 阅读

相关 jq实现复选框全选和反全选以及子复选框的状态改变父复选框状态的方法

html代码如下所示： <div> <label>

本是古典何须时尚/ 2022年06月05日 01:26/ 0 赞/ 212 阅读

相关 js实现复选框的全选、取消全选、反选

思路很简单：全选：将所有复选框的checked设置为true 取消全选：将所有复选框的checked设置为false 反选：将所有选中的复选框设置为false，未选中的

朱雀/ 2022年05月18日 05:47/ 0 赞/ 348 阅读

相关 JavaScript复选框（全选/全不选反选）

实例代码： 1 JS代码： <script type="text/javascript"> window.οnlοad=function()\{

一时失言乱红尘/ 2022年05月17日 01:46/ 0 赞/ 232 阅读

相关 javascript 复选框（checkbox）全选/全不选/反选

其实很简单，先分析一下效果分析：　　1，点击全选/全不选　　　全选文字变成全不选，同时全选按钮和所有按钮选中状态，否则，则相反　　2，点击反选按钮

た入场券/ 2021年11月19日 14:24/ 0 赞/ 512 阅读

相关复选框只读

readonly =‘readonly’ 这个不行。没啥用 disable=‘disable’ 这个是禁用，不能传值啥的 οnclick=“re

妖狐艹你老母/ 2021年08月27日 15:43/ 0 赞/ 548 阅读