jquery怎么让checkbox只读

青灯夜游
发布: 2022-07-25 16:06:39
原创
2165 人浏览过

两种只读的方法:1、使用attr()给复选框添加disabled属性,语法“$("input[type='checkbox']").attr("disabled",true);”;2、使用click()设置复选框点击时不进行checkbox状态改变,语法“$("input[type='checkbox']").click(function(){return false;})”。

jquery怎么让checkbox只读

本教程操作环境:windows7系统、jquery3.6.0版本、Dell G3电脑。

提到只读,很容易想到使用readonly属性,但是对于复选框(checkbox)来说,这个属性和期望得到的效果是有差别的。原因在于readonly属性关联的是页面元素的value属性(例如textbox,设置了readonly就不能修改输入框的文本内容),而复选框的勾选/取消并不改变其value属性,改变的只是一个checked状态。所以对于checkbox来说,设置了readonly,仍然是可以勾选/取消的。

option a
option b
option c
登录后复制

1.gif

但和readonly类似的,还有一个disabled属性,这个属性的作用是设置页面元素为不可用,即不可进行任何交互操作(包括不可修改value属性、不可修改checked状态等)。

option a
option b
option c
登录后复制

2.gif

方法1:

而在jquery中,可以使用attr()给复选框(checkbox)添加disabled属性



	
		
		
		
	
option a
option b
option c

登录后复制

3.gif

方法2:

如果使用disabled=“disabled”属性的话,会让checkbox变成灰色的,用户可能会反感效果,也可以设置复选框(checkbox)点击时不进行状态改变。

$(document).ready(function() {
	$("button").click(function() {
		$("input[type='checkbox']").click(
		function(){return false;}
		);
	});
});
登录后复制

4.gif

相关视频教程推荐:jQuery教程(视频)

以上是jquery怎么让checkbox只读的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!