通过form的action属性提交表单并接收处理返回值的方法（页面不跳转）

通过form的action属性提交表单，这个很容易。但是，由于这种方式是同步提交，所以会导致页面跳转，且不好拿到返回值。一般都用ajax代替。

有些情况ajax是不能使用的，严格的说是不好使用的。例如文件上传功能。

<input type = "file">

通过form的action属性提交表单，并接收处理返回值的方法如下：

html:

<iframe src="" frameborder="0" name="iframeContent" style="display: none;"></iframe>

<form action="aaa.json" target="iframeContent">

　　<input type="text" id="userName"/>

　　<input type="text" id="passWord"/>

　　<input type="submit" value="提交"/>

</form>

<script src="jquery-1.8.3.min.js"></script>

<script>

$("iframe[name=iframeContent]").on("load", function() {

　　var responseText = $("iframe")[0].contentDocument.body.getElementsByTagName("pre")[0].innerHTML;

　　alert(responseText);

　　//以下就可以判断并处理返回值

})

</script>

这个方法是这样的。

首先，写一个iframe，并且给iframe display:none;

form元素有一个target属性用于指定提交后跳转到哪个页面。所以指定target属性为iframe的name。这样的话返回值会存到iframe中。结构是这样的

<iframe>

<pre>{"code": "01"}</pre>

</iframe>

其次，通过js监听iframe的load事件。如果iframe加载完成，就会触发load事件。这样一旦有数据返回就会触发事件。

获取返回的数据，并处理返回的数据。

$("iframe")[0].contentDocument.body.getElementsByTagName("pre")[0].innerHTML;