如何改变输入文本的值?

Question

当我使用重置按钮作为以下表单的一部分时，如何使第一个输入文本(数字)的值消失:

<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="get">
<input type="text" name="number" value="<?php echo $result;?>">
<input type="submit">
<input type="reset">
<p name="result">The result is: <?php echo $result; ?> </p>
</form>

Answer 1

你可以在JS中这样做:

定义元素

let reset_btn = document.getElementById('btn-one');
let default_btn = document.getElementById('btn-two');

当点击重置设置值为null

reset_btn.onclick = function(){
document.getElementById('name-input').value = '';
}

设置值为默认值

default_btn.onclick = function(){
document.getElementById('name-input').value = '<?php echo $result;?>';
}

记得在你的btns中添加id。

Answer 2

我是这样做的:

<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="get">
<input type="text" id="input" name="number" value="<?php echo $result;?>">
<input type="submit">
<input type="button" onclick="resetInput()" value="Reset">
<p name="result">The result is: <?php echo $result; ?> </p>
</form>

和JavaScript:

function resetInput() {
document.getElementById("input").value = "";
}

单击按钮时，第一个输入id为input的值将被设置为空字符串。