JQuery, как очистить поле ввода

199

Я нахожусь в мобильном приложении и использую поле ввода, чтобы пользователь ввел номер.

Когда я возвращаюсь и возвращаюсь на страницу, в этом поле ввода отображается последний введенный номер, отображаемый в поле ввода.

Есть ли способ очистить поле каждый раз при загрузке страницы?

$('#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
источник

Ответы:

418

Вы можете очистить поле ввода, используя $('#shares').val('');

shaunsantacruz
источник
2
Работает ли это и соответствует ли это спецификации, если у нас есть числовой ввод, как это <input type="number" min="0' max="10" value="5"></input>? Я думаю, сказал по-другому, вы можете установить числовой ввод, чтобы быть пустым?
Кевин Уилер
3
Как насчет .val([])?
Fr0zenFyr
3
На связанной заметке, .val([])также можно отменить выбор любой выбранной опции в списке выбора ... не так много с .val(''). Лучшая вещь об этом - это кросс-браузерная поддержка PS: Это альтернатива только другому эффективному кросс-браузерному решению - $("select option").prop("selected", false);но работает со всеми входами. Спасибо Джону за тест, который он создал .
Fr0zenFyr
29 
$(document).ready(function(){
  $('#shares').val('');
});
osahyoun
источник
10

При отправке формы используйте метод сброса на форме. Метод reset () сбрасывает значения всех элементов в форме.

$('#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>
Развернуть фрагмент

Радхика
источник
Может помочь кому-то, но в этом контексте ваш ответ бесполезен.
Марко Конкас
8

настройка val('') очистит поле ввода. Так что вы бы использовали это:

Очистите поле ввода при загрузке страницы:

$(function(){
    $('#shares').val('');
});
Фрэнсис Льюис
источник
4

Поскольку вы используете jQuery, как насчет использования триггера- сброса :

$(document).ready(function(){
  $('#shares').trigger(':reset');
});
Sablefoste
источник
3

Для сброса ввода текста, числа, поиска, текстовой области:

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

Для сброса выберите:

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

Для сброса радиовхода:

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

Чтобы сбросить ввод файла:

$("#file-input").val(null);
цыплята
источник
0

если вы нажимаете кнопку «назад», она обычно имеет тенденцию к залипанию, что вы можете сделать, когда форма отправлена, очистите элемент, затем перед тем, как перейти на следующую страницу, но после выполнения с элементом, что вам нужно.

    $('#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>");
            });
Крис
источник