JavaScript ile form nasıl sıfırlanır (temizlenir)?

124

Denedim $("#client.frm").reset();ama çalışmıyor. JQuery ile form nasıl sıfırlanır?

javascript jquery

— akuzma
kaynak

Olası stackoverflow.com/questions/680241/blank-out-a-form-with-jquery

— svk

6

Not: Sil ve Sıfırla iki farklı şeydir. Reset ( .reset()), değerleri HTML'deki orijinal değerlere geri koyacaktır. Bunun için aşağıda Nick Craver'ın çözümüne bakın. "Temizle" tipik olarak değerleri boş / işaretsiz / seçilmemiş olarak ayarlamak anlamına gelir; MahmoudS çözümüne bakın.

— Luke

258

form.reset() bir DOM öğesi yöntemidir (jQuery nesnesinde değildir), bu nedenle şunlara ihtiyacınız vardır:

$("#client.frm")[0].reset();
//faster version:
$("#client")[0].reset();

Veya jQuery olmadan:

document.getElementById("client").reset();

— Nick Craver
kaynak

4

Beynim az önce genişledi, teşekkürler: "Bir jQuery nesnesi, bir veya daha fazla DOM öğesinin etrafında diziye benzer bir sarmalayıcıdır. Gerçek DOM öğelerine (jQuery nesnesi yerine) bir referans almak için iki seçeneğiniz vardır. Birincisi (ve en hızlı) yöntemi, dizi gösterimini kullanmaktır: $ ("#foo") [0]; // document.getElementById ("foo") ile eşdeğerdir İkinci yöntem .get () işlevini kullanmaktır: $ ("#foo ") .get (0); // Yukarıdakilerle aynı, sadece daha yavaş." learn.jquery.com/using-jquery-core/faq/…

— Andrew

Bir sonraki hatayı alıyorum: TypeError: document.getElementById (...). Reset bir işlev değil [Daha Fazla Bilgi Edinin]. Form için FormValidate eklentisini kullanıyorum. resetForm da formu sıfırlamıyor = (Herhangi bir öneriniz var mı?

— Eugen Konkov

Eugen, işte burada, Indiana Jones ve The Last Crusade gibi, bir inanç sıçraması yapmalısın. Document.getElementById ('myform']. Reset () 'i çağırırsanız, bu yöntem yok gibi görünse bile aslında formu temizleyecektir. Tipik M $ gizleme.

— Newclique

43

Şunları yapabilirsiniz:

$("#client.frm").trigger('reset')

— user2057484
kaynak

1

a Triggerbeni yeni dünyaya getiriyor

— gonatee

18

Saf JS çözümü aşağıdaki gibidir:

function clearForm(myFormElement) {

  var elements = myFormElement.elements;

  myFormElement.reset();

  for(i=0; i<elements.length; i++) {

  field_type = elements[i].type.toLowerCase();

  switch(field_type) {

    case "text":
    case "password":
    case "textarea":
          case "hidden":

      elements[i].value = "";
      break;

    case "radio":
    case "checkbox":
        if (elements[i].checked) {
          elements[i].checked = false;
      }
      break;

    case "select-one":
    case "select-multi":
                elements[i].selectedIndex = -1;
      break;

    default:
      break;
  }
    }
}

— Mahmoud Saleh
kaynak

1

İşte kabaca eşdeğer olması gereken jQuery eklenti çözümü. stackoverflow.com/a/24496012/1766230 ( selectedIndex = -1

— Luke

5

Bu çözüm şu anda çalışmıyor (2016'da). Form metin, parola ve metin alanı girdileri için varsayılan değerlere sahip olduğunda, [i] .value = "" öğeleri yerine [i] .defaultValue = "" öğelerini kullanmalısınız.

— Andrew F.

var field_type = elements[i].type.toLowerCase();

— Martynas Januškauskas

@Andrew: Ne istediğine bağlı. Eğer formu sadece e-postaya sıfırlamak defaultValueistiyorsanız, sadece reset()form nesnesini çağırabilirsiniz . Buradaki kod , formu sıfırlamak yerine temizlemektir .

— Bir

4

reset () yöntemi varsayılan değerleri ve onay kutusu alanını temizlemez ve daha pek çok sorun vardır.

Tamamen sıfırlamak için aşağıdaki bağlantıyı kontrol edin -

http://www.javascript-coder.com/javascript-form/javascript-reset-form.htm

— Alpesh
kaynak

4

Sıfırla (Temizle) Formu Javascript& jQuery:

Örnek Javascript:

document.getElementById("client").reset();

Örnek jQuery:

Referans Bağlantısını kullanmayı deneyebilirsiniztrigger()

$('#client.frm').trigger("reset");

— Gaurang P
kaynak

4

form.reset()Formdaki bazı giriş etiketlerinin özniteliği varsa işlev çalışmayacaktır.name='reset'

— alexbobroff
kaynak

2

Bunu dene :

$('#resetBtn').on('click', function(e){
    e.preventDefault();
    $("#myform")[0].reset.click();
}

— Hazem_M
kaynak

2

Formu aşağıdaki gibi temizleyin

document.forms[0].reset();

Grup içindeki form öğelerini kolayca temizleyebilirsiniz. bunu kullanarak forms[0].

— Nagaraju Vuppala
kaynak

1

JavaScript işlevini kullanın reset():

document.forms["frm_id"].reset();

— Felix Bagur
kaynak

1

Aşağıdakileri kullanabilirsiniz:

$('[element]').trigger('reset')

— Sadece öğreniyorum
kaynak

0

Bu kodu deneyin. Cevabınız için eksiksiz bir çözüm.

    <!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(":reset").css("background-color", "red");
});
</script>
</head>
<body>

<form action="">
  Name: <input type="text" name="user"><br>
  Password: <input type="password" name="password"><br>
  <button type="button">Useless Button</button>
  <input type="button" value="Another useless button"><br>
  <input type="reset" value="Reset">
  <input type="submit" value="Submit"><br>
</form>

</body>
</html>

— Jaffer Wilson
kaynak

-1

Onclick işlevini kullanarak tüm formu temizleyebilirsiniz. İşte bunun kodu.

 <button type="reset" value="reset" type="reset" class="btnreset" onclick="window.location.reload()">Reset</button>

window.location.reload () işlevi sayfanızı yenileyecek ve tüm veriler temizlenecektir.

— Arjun
kaynak