Bagaimana untuk membuat input tidak boleh diedit dalam javascript-Soal Jawab bahagian hadapan-php.cn

Bagaimana untuk membuat input tidak boleh diedit dalam javascript

WBOY

Lepaskan： 2022-04-11 11:41:23

asal

6827 orang telah melayarinya

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)".

Bagaimana untuk membuat input tidak boleh diedit dalam javascript

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi JavaScript 1.8.5, komputer Dell G3.

Cara untuk menetapkan input menjadi tidak boleh diedit dalam JavaScript

Terdapat dua cara untuk menetapkan input menjadi tidak boleh diedit.

1 Gunakan atribut disable

Atribut yang dilumpuhkan ialah atribut Boolean.

Atribut dilumpuhkan menentukan elemen

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)

Salin selepas log masuk

Hasil keluaran:

<!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(&#39;btn1&#39;);
        btn1.onclick = function () {
            var txt = document.getElementById(&#39;txt&#39;);
            txt.disabled = true;
        }
        var btn1 = document.getElementById(&#39;btn2&#39;);
        btn1.onclick = function () {
            var txt = document.getElementById(&#39;txt1&#39;);
            txt.setAttribute("readOnly", true);
        }
    </script>
</body>
</html>

Salin selepas log masuk

[Cadangan berkaitan:

tutorial video javascript

、bahagian hadapan web】

Atas 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!