如何使用 jQuery 清空输入字段答案

【问题标题】：How to empty input field with jQuery如何使用 jQuery 清空输入字段
【发布时间】：2012-03-03 10:15:01
【问题描述】：

我在一个移动应用中，我使用输入字段来让用户提交一个数字。

当我返回并返回输入字段显示输入字段显示的最新数字输入的页面时。

有什么方法可以在每次页面加载时清除该字段？

$('#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

【解决方案1】：

您可以使用$('#shares').val('');清除输入字段

【讨论】：

如果我们有一个像<input type="number" min="0' max="10" value="5"></input> 这样的数字输入，这是否有效，是否符合规范？我想换一种说法，您可以将数字输入设置为空白吗？
.val([]) 怎么样？
在相关说明中，.val([]) 也可以取消选择选择列表中的任何选定选项...与.val('') 不同。最好的一点是它的跨浏览器支持。 P.S: 这是唯一有效的跨浏览器解决方案的替代方案 - $("select option").prop("selected", false);，但适用于所有输入。感谢Jon a test he created。

【解决方案2】：

$(document).ready(function(){
  $('#shares').val('');
});

【讨论】：

【解决方案3】：

重置文本、数字、搜索、文本区域输入：

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

重置选择：

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

重置无线电输入：

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

重置文件输入：

$("#file-input").val(null);

【讨论】：

【解决方案4】：

在提交表单时，在表单上使用重置方法。 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>

【讨论】：

可以帮助某人，但在这种情况下，您的回答毫无用处。
谢谢兄弟，它帮助了我，我正在使用 '' 但使用 (reset) 更好！
谢谢拉迪卡！

【解决方案5】：

设置val('') 将清空输入字段。所以你会使用这个：

页面加载时清除输入字段：

$(function(){
    $('#shares').val('');
});

【讨论】：

【解决方案6】：

既然你用的是jQuery，那用触发器怎么样-reset:

$(document).ready(function(){
  $('#shares').trigger(':reset');
});

【讨论】：

【解决方案7】：

如果你点击“返回”按钮，它通常会卡住，你可以做的是在提交表单时清除元素，然后在它进入下一页之前，但在完成你需要的元素之后。

    $('#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>");
            });

【讨论】：