jquery jak opróżnić pole wejściowe

199

Jestem w aplikacji mobilnej i używam pola wejściowego, aby użytkownik przesłał numer.

Kiedy wrócę i wrócę do strony, w polu wprowadzania wyświetlana jest najnowsza liczba wyświetlana w polu wprowadzania.

Czy istnieje sposób wyczyszczenia pola za każdym razem, gdy strona się ładuje?

$('#shares').keyup(function(){
    payment = 0;
    calcTotal();
    gtotal = ($('#shares').val() * 1) + payment;
    gtotal = gtotal.toFixed(2);
    $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
});
jquery input numbers field kosbou
źródło

Odpowiedzi:

418

Możesz wyczyścić pole wprowadzania za pomocą $('#shares').val('');

shaunsantacruz
źródło
2
Czy to działa i czy jest zgodne ze specyfikacją, jeśli mamy takie dane liczbowe <input type="number" min="0' max="10" value="5"></input>? Sądzę, że powiedział inaczej, czy możesz ustawić, aby dane liczbowe były puste?
Kevin Wheeler,
3
Jak o .val([])?
Fr0zenFyr
3
W powiązanej notatce .val([])można również odznaczyć dowolną wybraną opcję na liście wyboru ... nie tyle z .val(''). Najlepsze w tym jest to, że obsługuje wiele przeglądarek. PS: Jest to alternatywa tylko dla innych wydajnych rozwiązań dla różnych przeglądarek - $("select option").prop("selected", false);ale działa ze wszystkimi danymi wejściowymi. Dzięki Jonowi za test, który stworzył .
Fr0zenFyr
29 
$(document).ready(function(){
  $('#shares').val('');
});
osahyoun
źródło
10

Podczas przesyłania formularza użyj metody resetowania w formularzu. Metoda reset () resetuje wartości wszystkich elementów w formularzu.

$('#form-id')[0].reset();

OR 

document.getElementById("form-id").reset();

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reset

$("#submit-button").on("click", function(){
       //code here
       $('#form-id')[0].reset();
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<form id="form-id">
  First name:<br>
  <input type="text" name="firstname">
  <br>
  Last name:<br>
  <input type="text" name="lastname">
  <br><br>
  <input id="submit-button" type="submit" value="Submit">
</form> 
</body>
</html>
Rozwiń fragment kodu

Radhika
źródło
Może komuś pomóc, ale w tym kontekście twoja odpowiedź jest bezużyteczna.
Marco Concas,
8

Ustawienie val('')spowoduje opróżnienie pola wprowadzania. Więc użyłbyś tego:

Wyczyść pole wejściowe podczas ładowania strony:

$(function(){
    $('#shares').val('');
});
Francis Lewis
źródło
4

Ponieważ używasz jQuery, co powiesz na resetowanie wyzwalacza :

$(document).ready(function(){
  $('#shares').trigger(':reset');
});
Sablefoste
źródło
3

Aby zresetować wprowadzanie tekstu, numeru, wyszukiwania, pola tekstowego:

$('#shares').val('');

Aby zresetować wybierz:

$('#select-box').prop('selectedIndex',0);

Aby zresetować wejście radiowe:

$('#radio-input').attr('checked',false);

Aby zresetować dane wejściowe pliku:

$("#file-input").val(null);
kurczaki
źródło
0

jeśli naciśniesz przycisk „wstecz”, zwykle ma tendencję do trzymania się, po przesłaniu formularza wyczyść element, zanim przejdzie on do następnej strony, ale po zrobieniu tego z tym, czego potrzebujesz.

    $('#shares').keyup(function(){
                payment = 0;
                calcTotal();
                gtotal = ($('#shares').val() * 1) + payment;
                gtotal = gtotal.toFixed(2);
                $('#shares').val('');
                $("p.total").html("Total Payment: <strong>" + gtotal + "</strong>");
            });
Chris
źródło