layer關閉彈出視窗觸發表單提交問題處理
阿新 • • 發佈:2019-02-19
1、前言
表單的程式碼:
<form>
此處理程式碼略...
<div id="footer">
<button class="btn btn-success" name="save" type="submit" title="儲存">儲存</button>
<button class="btn btn-success" id="_closed" onclick="closeCurrForm()">關閉</button>
</div>
</form>
closeCurrForm函式:
//關閉當前視窗
function closeCurrForm(){
//獲取視窗索引
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
}
2、問題及原因和解決方法
問題:上面的程式碼在點關閉按鈕後,會確發提交表單請求,會將表單的資訊進行儲存操作。但關閉按鈕是不需求執行儲存操作的。
原因:關閉按鈕沒有標識type屬性,系統會預設其type屬性為submit,所以點選它就會觸發儲存操作。
解決方法:為關閉安鈕新增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" >關閉</button>
</div>
</form>
觸發事件程式碼:
$(document).ready(function () {
//關閉當前視窗
$("#closeBtn").click(function(){
//獲取視窗索引
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
});
)};
這樣處理後,點關閉按鈕後就直接關閉視窗,不再執行儲存操作。