今天小編給大家分享一下jquery如何讓checkbox只讀的相關(guān)知識點(diǎn)，內(nèi)容詳細(xì)，邏輯清晰，相信大部分人都還太了解這方面的知識，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。

10年積累的成都網(wǎng)站設(shè)計(jì)、網(wǎng)站制作經(jīng)驗(yàn)，可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識你，你也不認(rèn)識我。但先建設(shè)網(wǎng)站后付款的網(wǎng)站建設(shè)流程，更有寧縣免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。

兩種只讀的方法：1、使用attr()給復(fù)選框添加disabled屬性，語法“$("input[type='checkbox']").attr("disabled",true);”；2、使用click()設(shè)置復(fù)選框點(diǎn)擊時(shí)不進(jìn)行checkbox狀態(tài)改變，語法“$("input[type='checkbox']").click(function(){return false;})”。

本教程操作環(huán)境：windows7系統(tǒng)、jquery3.6.0版本、Dell G3電腦。

提到只讀，很容易想到使用readonly屬性，但是對于復(fù)選框（checkbox）來說，這個(gè)屬性和期望得到的效果是有差別的。原因在于readonly屬性關(guān)聯(lián)的是頁面元素的value屬性(例如textbox，設(shè)置了readonly就不能修改輸入框的文本內(nèi)容)，而復(fù)選框的勾選/取消并不改變其value屬性，改變的只是一個(gè)checked狀態(tài)。所以對于checkbox來說，設(shè)置了readonly，仍然是可以勾選/取消的。

option a

option b

option c

但和readonly類似的，還有一個(gè)disabled屬性，這個(gè)屬性的作用是設(shè)置頁面元素為不可用，即不可進(jìn)行任何交互操作(包括不可修改value屬性、不可修改checked狀態(tài)等)。

option a

option b

option c

方法1：

而在jquery中，可以使用attr()給復(fù)選框（checkbox）添加disabled屬性

	
		
		
		
			$(document).ready(function() {
				$("button").click(function() {
					$("input[type='checkbox']").attr("disabled", true);
				});
			});
		
	

	
		option a

		option b

		option c

		

		讓復(fù)選框只讀
	

方法2：

如果使用disabled=“disabled”屬性的話，會讓checkbox變成灰色的，用戶可能會反感效果，也可以設(shè)置復(fù)選框（checkbox）點(diǎn)擊時(shí)不進(jìn)行狀態(tài)改變。

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

以上就是“jquery如何讓checkbox只讀”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會為大家更新不同的知識，如果還想學(xué)習(xí)更多的知識，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。