form提交保留输入input
时间: 2023-08-16 10:07:43 浏览: 45
您可以通过在form标签中添加"onsubmit"事件来实现在提交表单时保留输入。具体做法是在onsubmit事件中使用JavaScript代码来阻止表单的默认提交行为,然后将用户输入的数据存储到本地存储或者cookie中,最后重新加载页面的时候将数据填充回表单中。下面是一个简单的示例代码:
```html
<form onsubmit="return saveInputs()">
<input type="text" name="username">
<input type="password" name="password">
<button type="submit">提交</button>
</form>
<script>
function saveInputs() {
// 阻止表单默认提交
event.preventDefault();
// 获取表单中用户输入的数据
var username = document.getElementsByName('username')[0].value;
var password = document.getElementsByName('password')[0].value;
// 将数据存储到本地存储或者cookie中
localStorage.setItem('username', username);
localStorage.setItem('password', password);
// 返回true,允许表单提交
return true;
}
// 页面加载时从本地存储中获取数据并填充到表单中
document.getElementsByName('username')[0].value = localStorage.getItem('username');
document.getElementsByName('password')[0].value = localStorage.getItem('password');
</script>
```
注意:为了保护用户的隐私,密码等敏感信息应该使用加密算法进行加密再存储到本地存储或者cookie中。