javascript - 无 Action 的工作形式

Question

我正在尝试不执行任何操作即可执行 html 表单。它必须:

1)像正常形式一样记住输入数据。

2) 不重新加载页面

我尝试过:

<form action="javascript:void(0);" id="simple-form">

但是

$('#simple-form').submit();

表单不记得输入数据。范式

<form action="#" id="simple-form">

重新加载页面，但也会记住输入数据。

是否存在另一种无需 JavaScript 表单即可记住数据的方法？


更新#1:

event.preventDefault(); // onsubmit event prevert

工作原理不同，因为它不仅阻止页面重新加载，而且阻止数据保存(自动完成)。

Answer 1

使用 JavaScript

var form = document.getElementById("simple-form")
form.onsubmit = function (event) { event.preventDefault() }

if(localStorage){
    var textfield = document.getElementById("yourTextfield");
    var data = localStorage.getItem("yourTextfield");
    if(data){
       textfield.value = JSON.parse(data);
    }
    textfield.onkeydown = function(){
         localStorage.setItem("yourTextfield",JSON.stringify(textfield.value));
   }
}

使用历史对象的替代解决方案

var data = history.state.textfieldName;
if(data){
    textfield.value = data;
}
textfield.onkeydown = function(){
    history.state.textfieldName = textfield.value;
}