form表单target的用法,实现无刷新提交页面

时间:2022-01-20 14:32:59

form表单的target,当将iframe设置为隐藏时,可以实现当前页表单提交而不进行跳转刷新。代码如下,首页在页面里准备一个form表单和一个iframe。

  1. <form action="提交的action" method="post" target="myIframe">
  2. .....................
  3. </form>
  4. <iframe name="myIframe" style="display:none"></iframe>
<form action="提交的action" method="post" target="myIframe">
.....................
</form>
<iframe name="myIframe" style="display:none"></iframe>

提交到action后,action返回一串javascript语句。

  1. String script = "<script>alert('hello!');</script>";
  2. response.getOutputStream().write(script.getBytes("utf-8"));
String script = "<script>alert('hello!');</script>";
response.getOutputStream().write(script.getBytes("utf-8"));

alert('hello')将在当前页执行。原理是form提交后的结果在target指定的iframe里执行,
而iframe已经隐藏了。这样提交后的效果就和无刷新的效果一样。