快捷導(dǎo)航

關(guān)于在LayUI中使用AJAX提交巨坑記錄

更新時(shí)間：2019年10月25日 16:41:43 作者：_LIFE_

今天小編就為大家分享一篇關(guān)于在LayUI中使用AJAX提交巨坑記錄，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧

如下所示：

<script>
  layui.use(['layer', 'form','laydate'], function(){
    var layer = layui.layer
      ,laydate=layui.laydate
      ,form = layui.form;
 
    form.on('submit(go)', function(data){
      $.ajax({
        url:'/user/addOrUpdate',
        method:'post',
        data:data.field,
        dataType:'JSON',
        success:function(res){
          if(res.code='0'){
            parent.closeIframe(res.msg);
          }
          else
            alert(res.msg);
        },
        error:function (data) {
        }
      })
      return false;
    });
  });
</script>

上面代碼的紅色部分就是天坑：

癥狀：一個(gè)簡單的AJAX提交表單操作，經(jīng)常發(fā)生后臺數(shù)據(jù)保存好了，前端layer彈出層沒有關(guān)閉，父頁面沒有刷新，定位發(fā)現(xiàn)是回調(diào)函數(shù)沒有執(zhí)行?。。∮肎oogle Chrome瀏覽器這種現(xiàn)象較少，2而Safari 和 firefox瀏覽器100%發(fā)生。

解決過程：困擾了很久，以為是哪里代碼有問題，檢查來檢查去沒發(fā)現(xiàn)問題，后來基本定位到layUI這個(gè)框架。

結(jié)果：加上紅色字體 return false，解決！！

附上官方文檔關(guān)于這里的說明！！

form.on('submit(*)', function(data){
 console.log(data.elem) //被執(zhí)行事件的元素DOM對象，一般為button對象
 console.log(data.form) //被執(zhí)行提交的form對象，一般在存在form標(biāo)簽時(shí)才會返回
 console.log(data.field) //當(dāng)前容器的全部表單字段，名值對形式：{name: value}
 return false; //阻止表單跳轉(zhuǎn)。如果需要表單跳轉(zhuǎn)，去掉這段即可。
});

這是個(gè)毛意思？AJAX提交的時(shí)候坑咋不說？

以上這篇關(guān)于在LayUI中使用AJAX提交巨坑記錄就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

vue2.0實(shí)戰(zhàn)之基礎(chǔ)入門（1）
這篇文章主要為大家詳細(xì)介紹了vue2.0實(shí)戰(zhàn)第一篇基礎(chǔ)入門的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-03-03
純JS實(shí)現(xiàn)簡單的日歷
這篇文章主要為大家詳細(xì)介紹了純JS實(shí)現(xiàn)簡單日歷的的相關(guān)代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-06-06
15個(gè)高級前端開發(fā)小技巧總結(jié)分享
這篇文章主要介紹了15種不依賴JavaScript的高級Web開發(fā)技術(shù),涵蓋了從響應(yīng)式排版到圖像延遲加載的各個(gè)方面,展示了現(xiàn)代HTML和CSS的強(qiáng)大功能,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下
2024-11-11
iframe實(shí)用操作錦集
這篇文章主要介紹了有關(guān)iframe的實(shí)用操作，包括高度、傳遞數(shù)據(jù)等等，感興趣的朋友可以參考下
2014-04-04
常見JS驗(yàn)證腳本匯總
這篇文章主要介紹了常見JS驗(yàn)證腳本,結(jié)合實(shí)例形式匯總分析了JavaScript用于驗(yàn)證的系統(tǒng)自帶函數(shù)與自定義函數(shù),具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-12-12
詳解微信圖片防盜鏈“此圖片來自微信公眾平臺未經(jīng)允許不得引用”的解決方案
這篇文章主要介紹了詳解微信圖片防盜鏈“此圖片來自微信公眾平臺未經(jīng)允許不得引用”的解決方案，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2019-04-04
js實(shí)現(xiàn)移動端編輯添加地址【模仿京東】
本篇文章主要介紹了js實(shí)現(xiàn)移動端編輯添加地址[模仿京東]的實(shí)例。具有很好的參考價(jià)值。下面跟著小編一起來看下吧
2017-04-04
JavaScript SHA512加密算法詳細(xì)代碼
這篇文章主要為大家詳細(xì)介紹了JavaScript SHA512加密算法代碼，具有一定的參考價(jià)值，感興趣的朋友可以參考一下
2016-10-10
JS實(shí)現(xiàn)具備延時(shí)功能的滑動門菜單效果
這篇文章主要介紹了JS實(shí)現(xiàn)具備延時(shí)功能的滑動門菜單效果,涉及JavaScript基于鼠標(biāo)事件與時(shí)間函數(shù)實(shí)現(xiàn)頁面樣式延遲變換功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-09-09
JavaScript鏈?zhǔn)秸{(diào)用原理與實(shí)現(xiàn)方法詳解
這篇文章主要介紹了JavaScript鏈?zhǔn)秸{(diào)用,結(jié)合實(shí)例形式詳細(xì)分析了JavaScript鏈?zhǔn)秸{(diào)用基本原理、實(shí)現(xiàn)方法與相關(guān)操作注意事項(xiàng),需要的朋友可以參考下
2020-05-05