JSP form小记

当form表单中只有一个input type="text"的时候按回车键容易导致页面刷新,这是触发了form表单的自动提交

 

 οnsubmit="return false" 可以阻止form表单自动提交

转载于:https://my.oschina.net/u/3071497/blog/1517785

要实现JSP表单自动填充,你需要将先前提交表单时所输入的数据进行存储,然后在下一次访问该表单时将已存储的数据填充到表单中。 一种简单的方法是使用浏览器的本地存储功能(localStorage)。在表单提交时,将表单数据存储到localStorage中。在下一次访问该表单时,从localStorage中读取已存储的数据,并将其填充到表单中。以下是一个示例代码: ```html <!-- 在表单中添加一个id以便访问 --> <form id="myForm"> <label for="name">姓名:</label> <input type="text" name="name" id="name"> <br> <label for="email">邮箱:</label> <input type="email" name="email" id="email"> <br> <button type="submit">提交</button> </form> <script> // 当文档加载完毕时,检查localStorage中是否有存储的数据 document.addEventListener('DOMContentLoaded', function() { var form = document.getElementById('myForm'); var storedData = JSON.parse(localStorage.getItem('formData')); if (storedData) { // 将存储的数据填充到表单中 form.elements.name.value = storedData.name; form.elements.email.value = storedData.email; } // 监听表单的提交事件,将表单数据存储到localStorage中 form.addEventListener('submit', function(event) { event.preventDefault(); var formData = { name: form.elements.name.value, email: form.elements.email.value }; localStorage.setItem('formData', JSON.stringify(formData)); alert('表单已提交!'); }); }); </script> ``` 在这个示例中,我们使用了JSON.parse()和JSON.stringify()来将表单数据转换为字符串并存储到localStorage中。当用户重新访问该表单时,我们使用JSON.parse()方法将存储的数据转换回对象,并将其填充到表单中。 请注意,这种方法只能在同一台计算机上使用。如果用户在不同的设备或浏览器中访问该表单,存储的数据将不可用。为了解决这个问题,你可以考虑使用服务器端的会话管理或数据库来存储表单数据。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值