Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Bagaimana untuk membuat input tidak boleh diedit dalam javascript
Kaedah: 1. Gunakan tetapan atribut yang dilumpuhkan, sintaksnya ialah "elemen object.disabled = true"; 2. Gunakan kaedah setAttribute() dan tetapan atribut readOnly, sintaksnya ialah "element object.setAttribute(). "baca Sahaja", benar)".
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi JavaScript 1.8.5, komputer Dell G3.
Terdapat dua cara untuk menetapkan input menjadi tidak boleh diedit.
1 Gunakan atribut disable
Atribut yang dilumpuhkan ialah atribut Boolean.
Atribut dilumpuhkan menentukan elemen d5fd7aea971a85678ba271703566ebfd
Elemen input yang dilumpuhkan tidak boleh digunakan dan tidak boleh diklik.
2. Gunakan atribut baca sahaja dan kaedah setAttribute
Atribut baca sahaja menentukan bahawa medan input adalah baca sahaja.
Medan baca sahaja tidak boleh diubah suai. Walau bagaimanapun, pengguna masih boleh tab ke medan dan memilih atau menyalin teksnya.
Atribut baca sahaja menghalang pengguna daripada mengubah suai nilai sehingga syarat tertentu dipenuhi (seperti kotak semak sedang diperiksa). Kemudian, anda perlu menggunakan JavaScript untuk menghapuskan nilai baca sahaja dan menukar medan input kepada keadaan boleh diedit.
Kaedah setAttribute() digunakan untuk menambah atribut baharu dengan nama dan peraturan yang ditentukan, atau menetapkan atribut sedia ada kepada nilai yang ditentukan ialah:
Contohnya adalah seperti berikut:elementNode.setAttribute(name,value)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>123</title> </head> <body> <input id="txt" type="text" > <input id="btn1" type="button" value="利用disabled不可编辑"> <input id="txt1" type="text" > <input id="btn2" type="button" value="利用readOnly不可编辑"> <script> var btn1 = document.getElementById('btn1'); btn1.onclick = function () { var txt = document.getElementById('txt'); txt.disabled = true; } var btn1 = document.getElementById('btn2'); btn1.onclick = function () { var txt = document.getElementById('txt1'); txt.setAttribute("readOnly", true); } </script> </body> </html>
[Cadangan berkaitan:
tutorial video javascriptAtas ialah kandungan terperinci Bagaimana untuk membuat input tidak boleh diedit dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!