layer關(guān)閉彈出窗口觸發(fā)表單提交問題的處理方法
1、前言
表單的代碼:
<form> 此處理代碼略... <div id="footer"> <button class="btn btn-success" name="save" type="submit" title="保存">保存</button> <button class="btn btn-success" id="_closed" οnclick="closeCurrForm()">關(guān)閉</button> </div> </form>
closeCurrForm函數(shù):
//關(guān)閉當(dāng)前窗口 function closeCurrForm(){ //獲取窗口索引 var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); }
2、問題及原因和解決方法
問題:上面的代碼在點(diǎn)關(guān)閉按鈕后,會(huì)確發(fā)提交表單請求,會(huì)將表單的信息進(jìn)行保存操作。但關(guān)閉按鈕是不需求執(zhí)行保存操作的。
原因:關(guān)閉按鈕沒有標(biāo)識(shí)type屬性,系統(tǒng)會(huì)默認(rèn)其type屬性為submit,所以點(diǎn)擊它就會(huì)觸發(fā)保存操作。
解決方法:為關(guān)閉安鈕添加type屬性,值為button。type=”button”
3、具體代碼如:
此處理代碼略...
<div id="footer"> <button class="btn btn-success" name="save" type="submit" title="保存">保存</button> <button class="btn btn-success" id="closeBtn" type="button" >關(guān)閉</button> </div> </form>
觸發(fā)事件代碼:
$(document).ready(function () { //關(guān)閉當(dāng)前窗口 $("#closeBtn").click(function(){ //獲取窗口索引 var index = parent.layer.getFrameIndex(window.name); parent.layer.close(index); }); )};
這樣處理后,點(diǎn)關(guān)閉按鈕后就直接關(guān)閉窗口,不再執(zhí)行保存操作。
以上這篇layer關(guān)閉彈出窗口觸發(fā)表單提交問題的處理方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
整理的比較全的event對像在ie與firefox瀏覽器中的區(qū)別
event對像在IE與FF中的區(qū)別,本文整理了很多,個(gè)人感覺還是比較全面的,需要的朋友可以收藏下2013-11-11JavaScript練習(xí)小項(xiàng)目之修改div塊的顏色
這篇文章主要給大家介紹了關(guān)于JavaScript練習(xí)小項(xiàng)目之修改div塊的顏色的相關(guān)資料,文中通過舉例介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2023-01-01nestjs返回給前端數(shù)據(jù)格式的封裝實(shí)現(xiàn)
這篇文章主要介紹了nestjs返回給前端數(shù)據(jù)格式的封裝實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02微信小程序骨架屏的應(yīng)用與實(shí)現(xiàn)步驟詳細(xì)記錄
所謂骨架屏就是在頁面數(shù)據(jù)尚未加載前先給用戶展示出頁面的大致結(jié)構(gòu),直到請求數(shù)據(jù)返回后再渲染頁面,補(bǔ)充進(jìn)需要顯示的數(shù)據(jù)內(nèi)容,這篇文章主要給大家介紹了關(guān)于微信小程序骨架屏的應(yīng)用與實(shí)現(xiàn)的相關(guān)資料,需要的朋友可以參考下2022-05-05js 判斷圖片是否加載完以及實(shí)現(xiàn)圖片的預(yù)下載
這篇文章主要介紹了js 判斷圖片是否加載完以及實(shí)現(xiàn)圖片的預(yù)下載,需要的朋友可以參考下2014-08-08