Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery

青灯夜游

Lepaskan： 2022-06-09 17:04:55

asal

4373 orang telah melayarinya

Dua kaedah pelaksanaan: 1. Gunakan attr() untuk menambah atribut baca sahaja pada elemen input dan tetapkan nilai atribut kepada "baca sahaja", sintaksnya ialah "$("input").attr(" baca sahaja"," baca sahaja");". 2. Gunakan prop() untuk menambah atribut baca sahaja pada elemen input, dan tetapkan nilai atribut kepada "true", menggunakan sintaks "$("input").prop("readonly",true);".

Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 3.6.0, komputer Dell G3.

Untuk menjadikan input baca sahaja, cuma tambah atribut baca sahaja (baca sahaja) pada elemen input.

Oleh itu, menggunakan jquery untuk menjadikan input baca sahaja ditukar kepada menggunakan jquery untuk menambah atribut baca sahaja pada elemen input.

mempunyai dua kaedah pelaksanaan berikut:

Gunakan attr()
Gunakan prop()

1. Gunakan attr() untuk menetapkan status baca sahaja elemen input

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("input").attr("readonly","readonly");
				});
			});
		</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>

	<body>
		<input type="text" value="hello"/><br /><br />

		<button>给input添加只读属性</button>
	</body>
</html>

Salin selepas log masuk

Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery

2. Gunakan prop () Tetapkan status baca sahaja elemen input

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("input").prop("readonly",true);
				});
			});
		</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>

	<body>
		<input type="text" value="hello"/><br /><br />

		<button>给input添加只读属性</button>
	</body>
</html>

Salin selepas log masuk

Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery

Penjelasan:

Malah, kaedah prop() dan kaedah attr() adalah serupa kerana ia digunakan untuk mendapatkan atau menetapkan atribut HTML sesuatu elemen, tetapi terdapat perbezaan penting antara kedua-duanya.

Syor rasmi jQuery: Untuk atribut dengan dua nilai true dan false, seperti ditandai, dipilih dan dilumpuhkan, adalah disyorkan untuk menggunakan kaedah prop() untuk beroperasi, manakala untuk atribut lain adalah disyorkan untuk menggunakan kaedah attr() untuk beroperasi.

[Pembelajaran yang disyorkan: tutorial video jQuery, video bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk menukar input kepada keadaan baca sahaja dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!