规定form表单提交的页面打开方式

在实际应用中，可能有这样的需要，那就是提交表单之后，要求以某一种方式打开接收数据的页面。

下面就通过代码实例做一下简单介绍。

代码如下:

<code>&lt;!DOCTYPE html&gt;</code>

<code>&lt;</code><code>html</code><code>&gt;</code>

<code>&lt;</code><code>head</code><code>&gt;</code>

<code>&lt;</code><code>meta</code> <code>charset</code><code>=</code><code>"utf-8"</code><code>&gt;</code>

<code>&lt;</code><code>title</code><code>&gt;蚂蚁部落&lt;/</code><code>title</code><code>&gt;</code>

<code>&lt;</code><code>script</code> <code>type</code><code>=</code><code>"text/javascript"</code><code>&gt;</code>

<code>function sub() {</code>

<code>  </code><code>document.forms[0].elements[0].disabled = true;</code>

<code>  </code><code>document.forms[0].submit();</code>

<code>}</code>

<code>window.onload=function(){</code>

<code>  </code><code>var obt=document.getElementById("bt");</code>

<code>  </code><code>obt.onclick=function(){</code>

<code>    </code><code>sub();</code>

<code>  </code><code>}</code>

<code>&lt;/</code><code>script</code><code>&gt;</code>

<code>&lt;/</code><code>head</code><code>&gt;</code>

<code>&lt;</code><code>body</code><code>&gt;</code>

<code>&lt;</code><code>form</code> <code>action</code><code>=</code><code>"login.action"</code> <code>target</code><code>=</code><code>"_blank"</code> <code>method</code><code>=</code><code>"post"</code><code>&gt;</code>

<code>  </code><code>&lt;</code><code>input</code> <code>type</code><code>=</code><code>"button"</code> <code>name</code><code>=</code><code>"btn"</code> <code>id</code><code>=</code><code>"bt"</code> <code>value</code><code>=</code><code>"提交表单"</code> <code>/&gt;</code>

<code>&lt;/</code><code>form</code><code>&gt;</code>

<code>&lt;/</code><code>body</code><code>&gt;</code>

<code>&lt;/</code><code>html</code><code>&gt;</code>

上面的代码实现了我们的要求，可以在一个新的空白页面打开接收数据的页面。

实现方式就是使用form元素的target属性规定，非常的简单，类似于链接a的target属性。

原文发布时间为：2017-2-25

本文作者：admin

本文来自云栖社区合作伙伴“蚂蚁部落”，了解相关信息可以关注蚂蚁部落