Wykonaj kod zaraz po zresetowaniu formularza

Question

Jak mogę uruchomić fragment kodu natychmiast po zresetowaniu formularza?

Zdarzenie reset wywołuje przed pola formularza zostaną zresetowane do wartości domyślnych. Tak więc, na przykład:

$('form').on('reset', function(e) { 
    $('input').val('a value that should be set after the form has been reset'); 
}); 

to nie będzie działać. (Demo)

Jak Zdarzenie reset przed obsługuje przeglądarka zachowanie resetowania domyślny formularz, powyższy kod po prostu ustawia wprowadzić na value tuż przed domyślnym działań reset imprezy odbywa, przywracając wartość wejście do jej wartości domyślnej. Ma to sens, ponieważ będę mógł zadzwonić pod numer e.preventDefault(), aby anulować resetowanie formularza.

Mój przypadek użycia wymaga kodu wykonawczego zaraz po zresetowaniu formularza. W prostych przypadkach setTimeout wystarczyłby:

$('form').on('reset', function(e) { 
    setTimeout(function() { 
     $('input').val('yay it works now'); 
    }, 0); 
}); 

To działa, ponieważ setTimeout wykona kiedyś w przyszłości, po zakończeniu reset pęcherzyków i przeglądarka ma obchodzić swoje domyślne działanie.

Jednak, to traci synchronię. Jak tylko będę musiał programowo zresetować formularz i manipulować nim z innego miejsca, wszystko pójdzie na marne.

$('form').on('reset', function(e) { 
    setTimeout(function() { 
     $('input').val("reset'd value"); 
    }, 0); 
}); 

//somewhere in another module.. 
$('form').trigger('reset'); 
$('input').val('value after resetting the form'); 

(Demo)

Oczywiście, wszystko ma się dziać synchronicznie, ale tylko mój obsługi zdarzeń reset jest popychany do asynchronicznie uruchamiać w przyszłości, tym samym kończy się jazdy po całej bieżącego synchronicznego stos kodu został wykonany, kiedy miał zostać uruchomiony zaraz po zresetowaniu formularza.

Solutions Myślałem o: jeszcze

• pomocą drugiego setTimeout do uruchomienia po setTimeout. To jest zbyt brzydkie i nie chcę wskoczyć do piekła setTimeout.
• Zaimplementuj opakowanie do resetowania formularza, które ma funkcję zwrotną lub zwraca obiekt obietnicy. Wydaje się to jednak trochę przesadne.

Jeśli istniało tylko zdarzenie afterreset .. Cóż, czy przeoczyłem coś lub czy rozwiązania są powyżej moich jedynych opcji?

---

ja natknąłem te pytania podczas poszukiwania:

• Call a function after form reset
• Perform Javascript action after reset button handles click

Ale ich tytuły są (imho) trochę mylące, skoro te są faktycznie bardzo odległe od mojego problemu.

Answer 1

W twoim przypadku, po prostu przypisujesz domyślną wartość do twojego pola tekstowego. Po zresetowaniu formularza przeglądarka automatycznie zresetuje ją do wartości domyślnej.

<form> 
    <input value="Abc" type="text"/> 
    <input type="reset" /> 
</form> 

Sprawdź demo.