Mengapa Menukar Jenis Medan Input Daripada Kata Laluan kepada Teks Dengan jQuery Gagal?

jQuery: Menukar Jenis Medan Input

Senario ini melibatkan percubaan untuk mengubah atribut jenis medan input daripada kata laluan kepada teks menggunakan jQuery . Walau bagaimanapun, usaha itu terbukti tidak berjaya.

Kod yang disediakan, selepas pelaksanaan:

$(document).ready(function() {</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">// #login-box password field
$('#password').attr('type', 'text');
$('#password').val('Password');

Salin selepas log masuk

});

bertujuan untuk menyasarkan medan #kata laluan dengan atribut jenis ditetapkan sebagai kata laluan dan menukarnya kepada medan teks standard. Selepas itu, ia bertujuan untuk mengisi medan yang diubah dengan teks "Kata Laluan."

Namun, walaupun kod itu wujud, hasil yang diinginkan gagal menjadi kenyataan. Mengapa?

Isu utama isu ini terletak pada kebimbangan keselamatan dalam kefungsian penyemak imbas. Menukar jenis medan input, terutamanya daripada jenis selamat seperti kata laluan kepada yang biasa, mencetuskan langkah keselamatan yang dilaksanakan oleh penyemak imbas. Ini sering diperhatikan dengan penyemak imbas seperti Safari.

Untuk menyelesaikan dilema ini, penyelesaian menggunakan DOM kosong (Model Objek Dokumen) adalah dinasihatkan:

<br>var pass = document.createElement('input');<br>pass.type = 'password';<br>document.body.appendChild(pass);<br>pass.type = 'text';<br>pass.value = 'Kata Laluan';<br>

Pendekatan ini memintas had jQuery sambil mencapai hasil yang diingini.

Perlu diperhatikan bahawa pengubahsuaian langsung atribut jenis melalui jQuery menghadapi masalah dalam IE. Kod sumber jQuery mendedahkan kekangan ini:

<br>// Kami tidak boleh membenarkan sifat jenis ditukar (kerana ia menyebabkan masalah dalam IE)<br>jika ( nama == " type" && jQuery.nodeName( elem, "input") && elem.parentNode )</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">throw "type property can't be changed";

Salin selepas log masuk