点击按钮提交表单后如何不刷新页面

<form id = "form1">
    <input type = "text" value = "" placeholder = "请输入姓名"/>
    <input type = "submit">
</form>

我们给点击submit的时候，页面就被刷新，表单填写内容消失，并且，页面的可视区域也变了，那么如何让点击submit的时候，不会出现这种情况呢？

我们在</form>标签后面加上一个<iframe>标签，再通过js给form添加一个属性即可。

<form id = "form1">
    <input type = "text" value = "" placeholder = "请输入姓名"/>
    <input type = "submit">
</form>
<iframe id="iFrame" name="iFrame" src="about:blank" style="display:none;"></iframe>

// 设置点击submit之后不刷新当前页面
var form1 = document.getElementById('form1');
console.log(form1);
$("#form1").attr("target","iFrame");

这样我们点击submit之后表单内容不会丢失，页面也不会刷新了。