<html>
<body>
<form class="totalpayment">
<input class="paid" type="text" name="numberOne" />
<input class="due" type="text" name="numberTwo" />
<button>Add</button>
</form>
<p class="total"></p>
<script src="jquery.min.js"></script>
<script>
// Sum the value when submitting the form
$(".totalpayment").submit(function(e){
e.preventDefault();
var paid = parseInt($('.paid').val());
var due = parseInt($('.due').val());
$(".total").html(paid + due);
});
</script>
</body>
</html>
我有一个将两个数字相加的表单。我的问题是,它只有一个按钮,即“添加”按钮。假设我想添加取消按钮的处理程序,该处理程序将清除两个框,我将如何实现它?
最佳答案
只需再添加一个按钮即可重置表单。了解更多关于 Reset button
无需添加任何处理程序来重置表单。
<button type="reset" value="Cancel">Cancel</button>
示例代码:
<html>
<body>
<form class="totalpayment">
<input class="paid" type="text" name="numberOne" />
<input class="due" type="text" name="numberTwo" />
<button>Add</button>
<button type="reset" value="Cancel">Cancel</button>
</form>
<p class="total"></p>
<script src="jquery.min.js"></script>
<script>
// Sum the value when submitting the form
$(".totalpayment").submit(function(e){
e.preventDefault();
var paid = parseInt($('.paid').val());
var due = parseInt($('.due').val());
$(".total").html(paid + due);
});
</script>
</body>
</html>
关于javascript - JQuery - 如何实现取消按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31590237/