jQuery.form.js的使用詳解

更新時間：2017年06月14日 09:20:18 作者：naget

本文使用jquery.form.js解決提交之后，頁面發(fā)生跳轉(zhuǎn)，在一個空白頁面上顯示了后端返回的json數(shù)據(jù)問題，需要的朋友參考下

面臨問題：form表單submit之后，后端會返回提示信息。但原生html無法獲取后端返回的數(shù)據(jù)，就造成了這樣一種局面：提交之后，頁面發(fā)生跳轉(zhuǎn)，在一個空白頁面上顯示了后端返回的json數(shù)據(jù)，用戶體驗0分。

解決辦法：使用jquery.form.js

步驟

自定義控制提交函數(shù)

var submitChange=function () {
    $("form").ajaxSubmit(function (message) {
      alert(message.text);
      window.location.href="/index" rel="external nofollow" ;
    });
    return false;
  }
  //這個函數(shù)一是處理了后端返回的數(shù)據(jù)，二是返回了一個false，阻斷了原生submit事件的發(fā)生。

改造form表單(添加onsubmit事件，返回自定義處理函數(shù))

<form action="/do" onsubmit="return submitChange();">
</form>

最后

注意要把Js文件引入哦！

比如：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.2.1/jquery.form.min.js" integrity="sha384-tIwI8+qJdZBtYYCKwRkjxBGQVZS3gGozr3CtI+5JF/oL1JmPEHzCEnIKbDbLTCer" crossorigin="anonymous"></script>

以上所述是小編給大家介紹的jQuery.form.js的使用詳解，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

jquery.form.js

相關(guān)文章

jQuery實現(xiàn)標(biāo)簽頁效果實戰(zhàn)（4）
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)標(biāo)簽頁效果的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-02-02
jQuery插件EasyUI實現(xiàn)Layout框架頁面中彈出窗體到最頂層效果(穿越iframe)
這篇文章主要介紹了jQuery插件EasyUI實現(xiàn)Layout框架頁面中彈出窗體到最頂層效果,具有穿越iframe的功能,涉及jQuery的EasyUI插件屬性操作相關(guān)技巧,需要的朋友可以參考下
2016-08-08
jQuery如何防止這種冒泡事件發(fā)生
這篇文章主要介紹了Jquery使我們簡化了禁止冒泡事件的操作，只需幾行代碼,需要的朋友可以參考下
2015-02-02
jquery easyui滾動條部分設(shè)置介紹
dialog并沒有隨著滾動條往下滾動，這時就需要用戶滑動滾動條來定位dialog，在說出解決方案前先來普及一下jquery關(guān)于定位的幾個方法
2013-09-09
jquery判斷復(fù)選框是否被選中的方法
這篇文章主要介紹了jquery判斷復(fù)選框是否被選中的方法，需要的朋友可以參考下
2015-10-10
jQuery中unwrap()方法用法實例
這篇文章主要介紹了jQuery中unwrap()方法用法,實例分析了unwrap()方法的定義、功能及移除匹配元素父元素的使用技巧,需要的朋友可以參考下
2015-01-01
解析Jquery取得iframe中元素的幾種方法
iframe在復(fù)合文檔中經(jīng)常用到，利用jquery操作iframe可以大幅提高效率，這里收集一些基本操作，需要的朋友可以參考下
2013-07-07
chrome下jq width()方法取值為0的解決方法
使用了jq的width()方法時在ff跟ie下運行問題不大，但是到了chrome上，就出現(xiàn)問題
2014-05-05
Jquery easyui 下loaing效果示例代碼
本文為大家詳細介紹下Jquery easyui 下loaing效果具體是如何實現(xiàn)的，感興趣的各位可以參考下
2013-08-08
使用CSS樣式position:fixed水平滾動的方法
這篇文章主要介紹了使用CSS樣式position:fixed水平滾動的方法,需要的朋友可以參考下
2014-02-02