Kaedah JavaScript untuk menentukan sama ada pengguna telah mengubah suai kemahiran form_javascript

Contoh dalam artikel ini menerangkan cara JavaScript menentukan sama ada pengguna telah mengubah suai borang. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Kod JS ini boleh menentukan sama ada pengguna telah mengubah suai kandungan borang Jika borang diubah suai dan pelayar keluar, pengguna akan diingatkan sama ada untuk menyimpan kandungan borang itu.

function formIsDirty(form) {
 for (var i = 0; i < form.elements.length; i++) {
  var element = form.elements[i];
  var type = element.type;
  if (type == "checkbox" || type == "radio") {
   if (element.checked != element.defaultChecked) {
    return true;
   }
  }
  else if (type == "hidden" || type == "password" ||
       type == "text" || type == "textarea") {
   if (element.value != element.defaultValue) {
    return true;
   }
  }
  else if (type == "select-one" || type == "select-multiple") {
   for (var j = 0; j < element.options.length; j++) {
    if (element.options[j].selected !=
      element.options[j].defaultSelected) {
     return true;
    }
   }
  }
 }
 return false;
}

Contoh penggunaan: Apabila keluar dari penyemak imbas, jika pengguna mengubah suai borang, ingatkan pengguna sama ada untuk menyimpannya

window.onbeforeunload = function(e) {
 e = e || window.event; 
 if (formIsDirty(document.forms["someForm"])) {
  // For IE and Firefox
  if (e) {
   e.returnValue = "You have unsaved changes.";
  }
  // For Safari
  return "You have unsaved changes.";
 }
};

Berikut ialah kod sampel lengkap

Salin kod Kod adalah seperti berikut:

Klik pada butang di bawah Sekarang tukar beberapa nilai dalam bentuk dan klik butang lagi.
2fda86d4b1e3d85a633406660136b8cf
f9f8cb3fc15ff683ecb7aa897331e5170c6dc11e160d3b678d68754cc175188a
b29032f60b085ba7995634e35655630f0c6dc11e160d3b678d68754cc175188a
8352e2639651827268bdcc93dd19c816
           0f5cb9dd8cc37b71e979b6f81c689874foo4afa15d3069109ac30911f04c56f3338
                                                                                                                                                                                                                                        18bb6ffaf0152bbe49cd8a36203463410c6dc11e160d3b678d68754cc175188a
f5a47148e367a6035fd7a2faa965022e
952652e591fede9a3a3f5597cc096fc6Klik untuk menyemak sama ada Borang Kotor65281c5ac262bf6d81768915a4a77ac0
0c6dc11e160d3b678d68754cc175188a
855348821b2e8f2cc4b633bf98f064df
function formIsDirty(form) {
untuk (var i = 0; i f835084d3cb18ab15e03f4f39af848af

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.