Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery

Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery

青灯夜游
Lepaskan: 2022-06-15 10:37:42
asal
2569 orang telah melayarinya

Dua cara untuk menetapkan baca sahaja: 1. Gunakan attr() untuk menambah atribut baca sahaja pada kotak teks teks dan tetapkan nilai atribut kepada "baca sahaja", sintaksnya ialah "$("textarea" ).attr("baca sahaja","baca sahaja");". 2. Gunakan prop() untuk menambah atribut baca sahaja pada kotak teks teks dan tetapkan nilai atribut kepada "true", menggunakan sintaks "$("textarea").prop("readonly",true);".

Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery

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

Dalam HTML, status baca sahaja sesuatu elemen dikawal oleh atribut baca sahaja (baca sahaja).

Jika anda ingin menetapkan status baca sahaja bagi kotak teks (textarea), anda hanya perlu menambah atribut baca sahaja pada elemen textarea.

jquery mempunyai dua kaedah berikut untuk menambah atribut pada elemen:

  • Gunakan attr()

  • Gunakan prop()

Kaedah 1. Gunakan attr() untuk menetapkan status baca sahaja bagi kotak teks teks

Hanya gunakan attr() Tambahkan atribut baca sahaja pada elemen textarea dan tetapkan nilai atribut kepada "baca sahaja".

Kod pelaksanaan:

<!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() {
					$("textarea").attr("readonly","readonly");
				});
			});
		</script>
	</head>

	<body>
		<textarea>默认文本</textarea><br /><br />

		<button>给text文本框添加只读属性</button>
	</body>
</html>
Salin selepas log masuk

Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery

Seperti yang anda lihat, selepas mengklik butang tetapan, kursor kotak teks hilang dan input teks tiada lebih lama mungkin.

Kaedah 2. Gunakan prop() untuk menetapkan status baca sahaja bagi kotak teks teks

Hanya gunakan prop() untuk menambah atribut baca sahaja pada kawasan teks elemen dan tetapkan nilai atribut Hanya "benar".

Kod pelaksanaan:

<script type="text/javascript">
	$(document).ready(function() {
		$("button").click(function() {
			$("textarea").prop("readonly",true);
		});
	});
</script>
Salin selepas log masuk

Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery

Begitu juga, selepas mengklik butang tetapan, kursor kotak teks teks hilang dan input teks tidak lagi boleh dilakukan .

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

Atas ialah kandungan terperinci Bagaimana untuk menetapkan status baca sahaja untuk kotak teks teks dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan