layer常用提示框
文章轉自https://blog.csdn.net/alice_qixin/article/details/70210420,感謝作者。
一 layer的普通提示框
效果:
程式碼:
layer.alert('次案件已回庫,請選擇其他案件', {
icon: 5,
title: "提示"
});
title屬性不設定時預設為“資訊”。如下
二 layer 帶輸入框的提示框
效果:
注意!必須引入layer.js 如果不行再引入他的延伸js layer.ext.js 或者layer3.0.1版本的layer.js
程式碼:
layer.prompt({
formType: 2,
value: '駁回!',
title: '請輸入駁回理由'
}, function(value, index, elem){
layer.close(index);
//layer.alert(value);
$.ajax({
type: "post",
url: "/visit/updateVisitApply",
data: {
"id": id,
"status": "3",
"reason":value
},
async: true,
});
layer.alert('駁回成功');
location=location;
});
value:輸入框的預設值
title:提示框的標題
layer.close(index); 點選確定後關閉提示框。
三 layer 的判斷提示框
效果:
程式碼:
layer.confirm('您確定要刪除這條資料嗎?', {
btn: ['確定','取消'] //按鈕
}, function()
{
layer.closeAll('dialog');
$.ajax({
type: "post",
url: "${pageContext.request.contextPath}/cuishou/delete",
data: {
"id": id
},
success : function(data){
}
});
});
layer.closeAll('dialog'); 點選確定關閉提示框
四 layer的iframe彈框
效果:在頁面中彈出一個子頁面。呼叫別的jsp
程式碼:
首先先定義
//定義全域性變數
var myLayer = {
index : 0,
close : function() {
layer.close(this.index);
location.reload();
},
parentCaseIds : function() {
var array = new Array();
var checks = $("table tr td input[type='checkbox']:checked");
$.each(checks, function() {
var dataId = $(this).parent().parent().attr("data-id");
if (dataId)
array.push(dataId);
});
return array;
}
};
$("#roleSelect").on("click",function(){
var userId = $("input[type='radio']:checked").val();
if(typeof(userId)=='undefined'){
layer.alert('請選擇員工', {
icon: 5
});
return;
}else{
//彈出框分配角色介面
myLayer.index=layer.open({
type: 2,
title: "角色分配",
area: ['400px','300px'],
content:'${pageContext.request.contextPath }/cuishou/roleList?emplist=${emplist}&userId='+userId+''
});
}
});
獲取父頁面table選中行的引數
js程式碼:
//獲取被選中的tr
var id=$('.selected', window.parent.document).find(".needid").attr('data-id');//獲取父頁面單選選中的自定義id值
var visitid=$('.selected', window.parent.document).find(".visitid").html();//獲取父頁面單選選中的行的td根據td的class獲取td內容
var empId = $("input[type='radio']:checked").val();//獲取本頁面單選框的值
var appointName=$("input[type='radio']:checked").parents("tr").find(".appointName").html();//獲取本頁面單選選中的行根據td的class獲取td內容