// JavaScript Document
|
|
;(function($){
|
$.extend({
|
|
//位置在中间弹出框不可滚动
|
popupEle:function(popEleId){
|
$.popui({
|
popupEle : popEleId,
|
overlay : true,
|
popRoll : false,
|
overlayCss : {
|
background : '#000',
|
opacity : 0.6
|
},
|
popCss : {
|
background : 'none'
|
}
|
});
|
},
|
|
//关闭弹出框
|
closePop:function(ele){
|
$.closepop({popupEle : ele});
|
},
|
|
//确认提示框
|
confirmInfo:function(options){
|
|
var opts = $.extend({
|
title : '确认信息',
|
text : '确认要删除吗？',
|
sure : function(){},
|
cancel : function(){}
|
}, options);
|
|
var str = '<div class="confirmpop" id="confirmPop"><div class="confirm_title clearfix"><h3>'+opts.title+'</h3><a id="confirmPopClose">×</a></div><div class="confirm_con"><p>'+opts.text+'</p><div class="confirmbtn_Wrap"><a id="confirmSureBtn">确认</a><a id="confirmCancelBtn">取消</a></div></div></div>';
|
|
$(str).appendTo('body');
|
var cp = $('#confirmPop'),
|
cpc = $('#confirmPopClose'),
|
cpsb = $('#confirmSureBtn'),
|
spcb = $('#confirmCancelBtn');
|
cpc.click(function(){
|
confirmPopDel();
|
});
|
cpsb.click(function(){
|
confirmPopDel();
|
opts.sure();
|
});
|
spcb.click(function(){
|
confirmPopDel();
|
opts.cancel();
|
});
|
function confirmPopDel(){
|
$.closePop('confirmPop');
|
cp.remove();
|
};
|
|
$.popupEle('confirmPop');
|
cp.show();
|
},
|
|
//弹出提示信息
|
popupTips:function(words){
|
var tipsClass = $('div.popup_tips_div');
|
if(tipsClass.length != 0){
|
tipsClass.remove();
|
};
|
$('<div class="popup_tips_div" id="popupTipsDiv">'+words+'</div>').appendTo('body');
|
var tipsId = $('#popupTipsDiv');
|
tipsId.css({
|
padding : '20px 40px',
|
borderRadius : '5px',
|
color : '#FFF',
|
display : 'none',
|
font : '16px "微软雅黑"',
|
lineHeight : '24px'
|
});
|
tipsHeight = parseInt(tipsId.height()) + 40;
|
tipsWidth = parseInt(tipsId.width()) + 80;
|
$.popui({
|
popupEle : 'popupTipsDiv',
|
popRoll : false,
|
overlay : false,
|
autoHide : true,
|
timeout : 1500,
|
popCss : {
|
background : 'none',
|
height : tipsHeight,
|
width : tipsWidth
|
}
|
});
|
var timer = setTimeout(function(){
|
tipsId.remove();
|
}, 1550);
|
},
|
|
//位置在中间弹出框不可滚动无遮罩
|
popupEleNoMask:function(popEleId){
|
$.popui({
|
popupEle : popEleId,
|
overlay : false,
|
popRoll : false,
|
popCss : {
|
background : 'none'
|
}
|
});
|
},
|
|
//位置在中间弹出框可滚动
|
popupEleRoll:function(popEleId){
|
$.popui({
|
popupEle : popEleId,
|
overlay : true,
|
popRoll : true,
|
overlayCss : {
|
background : '#000',
|
opacity : 0.6
|
},
|
popCss : {
|
background : 'none'
|
}
|
});
|
},
|
|
//能指定位置弹出框： 可传递位置：topleft, topright, bottomleft, bottomright ; 下面参数与上边对应：left, right, top, bottom
|
popupPos:function(options){
|
var defaults = {
|
eleId : 'eleId',
|
postion : 'topleft',
|
left : '10px',
|
right : '10px',
|
top : '10px',
|
bottom : '10px',
|
height : '80px',
|
width : '200px'
|
};
|
var opts = $.extend(defaults, options);
|
$.popui({
|
popupEle : opts.eleId,
|
popupPos : opts.postion,
|
overlay : false,
|
popRoll : false,
|
popCss : {
|
left : opts.left,
|
right : opts.right,
|
top : opts.top,
|
bottom : opts.bottom,
|
background : 'none',
|
height : opts.height,
|
width : opts.width
|
}
|
});
|
var popId = $('#'+opts.eleId);
|
var pt = parseInt(popId.css('padding-top')),
|
pb = parseInt(popId.css('padding-bottom')),
|
pl = parseInt(popId.css('padding-left')),
|
pr = parseInt(popId.css('padding-right')),
|
bt = popId.css('border-top-width') == 'medium' ? 0 : parseInt(popId.css('border-top-width')),
|
bb = popId.css('border-bottom-width') == 'medium' ? 0 : parseInt(popId.css('border-bottom-width')),
|
bl = popId.css('border-left-width') == 'medium' ? 0 : parseInt(popId.css('border-left-width')),
|
br = popId.css('border-right-width') == 'medium' ? 0 : parseInt(popId.css('border-right-width'));
|
popId.css({
|
height : opts.height - bt - pt - pb - bb,
|
width : opts.width - bl - pl - pr - br
|
});
|
},
|
|
//右下角弹出框
|
popupBottomRight:function(popEleId, eleH, eleW){
|
$.popui({
|
popupEle : popEleId,
|
popupPos : 'bottomright',
|
overlay : false,
|
popRoll : false,
|
popCss : {
|
background : 'none',
|
height : eleH,
|
width : eleW
|
}
|
});
|
var popId = $('#'+popEleId);
|
var pt = parseInt(popId.css('padding-top')),
|
pb = parseInt(popId.css('padding-bottom')),
|
pl = parseInt(popId.css('padding-left')),
|
pr = parseInt(popId.css('padding-right')),
|
bt = popId.css('border-top-width') == 'medium' ? 0 : parseInt(popId.css('border-top-width')),
|
bb = popId.css('border-bottom-width') == 'medium' ? 0 : parseInt(popId.css('border-bottom-width')),
|
bl = popId.css('border-left-width') == 'medium' ? 0 : parseInt(popId.css('border-left-width')),
|
br = popId.css('border-right-width') == 'medium' ? 0 : parseInt(popId.css('border-right-width'));
|
popId.css({
|
height : eleH - bt - pt - pb - bb,
|
width : eleW - bl - pl - pr - br
|
});
|
},
|
|
//跟随元素弹出
|
followEle:function(eventEleId, popupEleId){
|
$.popui({
|
popupEle : popupEleId,
|
eventEle : eventEleId,
|
popRoll : true,
|
overlay : false,
|
follow : true,
|
popCss : {
|
background : 'none'
|
}
|
});
|
},
|
|
//滚动到顶部
|
scrollTop:function(){
|
$('body,html').animate({scrollTop:0},1000);
|
},
|
|
//滚动到底部
|
scrollBottom:function(){
|
$('body,html').animate({scrollTop:$(document).height()},1000);
|
},
|
|
//滚动到固定位置
|
scrollPos:function(eleId){
|
$("html,body").stop(true);
|
$("html,body").animate({scrollTop: $("#" + eleId).offset().top}, 600);
|
},
|
|
//点击滚动到顶部
|
clickToTop:function(eleId){
|
var backtop = $('#' + eleId),
|
bt = backtop.css('border-top-width') == 'medium' ? 0 : parseInt(backtop.css('border-top-width')),
|
bb = backtop.css('border-bottom-width') == 'medium' ? 0 : parseInt(backtop.css('border-bottom-width')),
|
bth = parseInt(backtop.height()) + bt + parseInt(backtop.css('padding-top')) + parseInt(backtop.css('padding-bottom')) + bb;
|
backtop.hide();
|
$(window).scroll(function(){
|
var bm = $(window).height()-backtop.height()-10;
|
if($(window).scrollTop()<100){
|
backtop.fadeOut(1000);
|
}else{
|
topAndBottom.fadeIn(1000);
|
var st = $(document).scrollTop();
|
backtop.css('top',bm+st);
|
};
|
});
|
backtop.click(function(){
|
$.scrollTop();
|
});
|
},
|
|
//获取焦点
|
inputFocus:function(ele){
|
ele.focus(function(){
|
if($(this).val() ==this.defaultValue){$(this).val("");}
|
}).blur(function(){
|
if ($(this).val()==''){$(this).val(this.defaultValue);}
|
});
|
}
|
});
|
})(jQuery);
|
|
|
/*--------------------------------------------------------------iframe对话框dialog方法(start)--------------------------------------------------------------*/
|
function Dialog(){
|
this.width = 60;
|
this.height = 60;
|
this.mode = 'percentage' //pixel;
|
this.opacity = 0.6;
|
this.speed = 500;
|
this.zIndex = 9000;
|
this.config = {};
|
}
|
|
Dialog.prototype = {
|
openDialog:function(dialogId, title, config, url){
|
this.config = config || {};
|
var $window = $(window),
|
wWidth = parseInt($window.width()),
|
wHeight = parseInt($window.height()),
|
dHeight = parseInt($(document).height()),
|
width = parseInt(this.width),
|
height = parseInt(this.height),
|
mode = this.mode,
|
opacity = parseInt(this.opacity),
|
speed = this.speed,
|
config = config || {},
|
zIndex = $('div.dialog_overlay').length == 0 ? this.zIndex : parseInt($('div.dialog_overlay:last').css('z-index')) + 2;
|
if(config.dialogStyle){
|
var widthSelf = parseInt(config.dialogStyle.width),
|
heightSelf = parseInt(config.dialogStyle.height),
|
opacitySelf = parseInt(config.dialogStyle.opacity),
|
modeSelf = config.dialogStyle.mode;
|
isNaN(widthSelf) == false ? width = widthSelf : width = width;
|
isNaN(heightSelf) == false ? height = heightSelf : height = height;
|
isNaN(opacitySelf) == false ? opacity = opacitySelf : opacity = opacity;
|
isNaN(modeSelf) == true ? mode = modeSelf : mode = mode;
|
}
|
|
var overlayStr = '<div class="dialog_overlay" id="dialogOverlay'+dialogId+'"></div>',
|
dialogStr = '<div class="dialog_popup" id="dialogPopup'+dialogId+'"><div class="dp_top"><h3>'+title+'</h3><a class="dialogclose" id="dialogClose'+dialogId+'">×</a></div><div class="dp_con"><iframe name="dialogIframe'+dialogId+'" id="dialogIframe'+dialogId+'" class="dialog_iframe" src="'+url+'" scrolling="auto" allowTransparency="true" frameborder="0"></iframe></div><div class="dp_mid"><div class="btn_wrap clearfix"><a class="dpbtn" id="dialogCancel'+dialogId+'"> <span>关闭</span></a>';
|
if(config.buttons && config.buttons.length > 0){
|
for(var i=0; i<config.buttons.length; i++){
|
var btnId = config.buttons[i].btnId,
|
btnStyle = config.buttons[i].btnStyle,
|
btnName = config.buttons[i].btnName;
|
dialogStr += '<a onclick="return _OnCustomerBtnClick(\''+btnId+'\',\''+dialogId+'\')" class="dpbtn '+btnStyle+'" id="'+btnId+'"><span>'+btnName+'</span></a>';
|
}
|
}
|
dialogStr += '</div></div></div>';
|
|
$(overlayStr).appendTo($('body'));
|
$(dialogStr).appendTo($('body'));
|
$('body').css('overflow', 'hidden');
|
var oly = $('#dialogOverlay' + dialogId),
|
dlg = $('#dialogPopup' + dialogId),
|
dcl = $('#dialogCancel' + dialogId),
|
dce = $('#dialogClose' + dialogId),
|
dlgwidth = 0,
|
dlgheight = 0;
|
if(mode == 'percentage'){
|
dlgwidth = wWidth * width / 100,
|
dlgheight = wHeight * height / 100;
|
}else if(mode == 'pixel'){
|
dlgwidth = width,
|
dlgheight = height;
|
}else{
|
dlgwidth = wWidth * width / 100,
|
dlgheight = wHeight * height / 100;
|
}
|
oly.css({
|
display : 'none',
|
width : wWidth,
|
height :dHeight,
|
opacity : opacity,
|
zIndex : zIndex
|
});
|
dlg.css({
|
left : (wWidth - dlgwidth) / 2,
|
top : (wHeight - dlgheight) / 2,
|
display : 'none',
|
width : dlgwidth,
|
height : dlgheight,
|
zIndex : zIndex + 1
|
});
|
dlg.children('div.dp_con').css('height', dlgheight - parseInt(dlg.children('div.dp_top').height()) - parseInt(dlg.children('div.dp_mid').height()) - 2);
|
|
oly.fadeIn(speed);
|
dlg.fadeIn(speed > 100 ? speed - 100 : speed);
|
|
dcl.click(function(){
|
closeDialogFunc(oly, dlg, speed);
|
});
|
dce.click(function(){
|
closeDialogFunc(oly, dlg, speed);
|
});
|
|
return 'dialogIframe' + dialogId;
|
},
|
closeDialog:function(dialogId){
|
var speed = this.speed,
|
oly = $('#dialogOverlay' + dialogId),
|
dlg = $('#dialogPopup' + dialogId);
|
closeDialogFunc(oly, dlg, speed);
|
}
|
}
|
|
function _OnCustomerBtnClick(btnID, dialogId){//调用子页函数
|
$('#dialogIframe' + dialogId).get(0).contentWindow.onDialogBtnClick(btnID, dialogId, popupDialog.config);
|
}
|
|
function closeDialogFunc(oly, dlg, speed){//关闭弹出层
|
oly.fadeOut(speed);
|
dlg.fadeOut(speed);
|
setTimeout(function(){
|
dlg.find('iframe').remove();
|
oly.remove();
|
dlg.remove();
|
}, speed);
|
$('body').css('overflow', 'auto');
|
}
|
|
var popupDialog = new Dialog();//new弹出框dialog对象
|
|
$(window).resize(function(){
|
var $window = $(window),
|
wWidth = parseInt($window.width()),
|
wHeight = parseInt($window.height()),
|
dHeight = parseInt($(document).height());
|
$('div.dialog_overlay').each(function(i){
|
var oly = $('div.dialog_overlay').eq(i),
|
dlg = $('div.dialog_popup').eq(i);
|
oly.css({
|
width : wWidth,
|
height :dHeight,
|
});
|
dlg.css({
|
left : (wWidth - parseInt(dlg.width())) / 2,
|
top : (wHeight - parseInt(dlg.height())) / 2
|
});
|
});
|
});
|
|
|
//弹出对话框带url
|
//调用方式:popDialog(自定义ID，弹出框名称，配置参数，地址);
|
/*var config0 = {
|
businessID:"自定义参数",//自定义传入的参数
|
dialogStyle:{//弹出框相关样式
|
width : 40,
|
height : 60,
|
mode : 'pixel',
|
opacity : 0.2
|
},
|
buttons:[//按钮配置
|
{btnId:"btnOutput", btnName:"导出", btnStyle:"bluebtn export"},
|
{btnId:"btnPrint", btnName:"打印", btnStyle:"bluebtn print"},
|
{btnId:"btnSure", btnName:"确定", btnStyle:"bluebtn"}
|
]
|
};
|
popDialog('dialogOne', '第一层弹出', config0, 'dialog-two.html');
|
function onDialogBtnClick(btnID, dialogID, config){//此函数放在子页面
|
if(btnID == "btnSure"){
|
hideDialog('dialogOne');
|
}
|
if(btnID == "btnRefresh"){
|
//dialogRefresh('dialogOne');
|
}
|
if(config.businessID){alert(config.businessID)}
|
}
|
*/
|
function popDialog(dialogId, title, config, url){
|
popupDialog.openDialog(dialogId, title, config, url);
|
}
|
|
//弹出对话框不带url
|
//调用方式<a href="http://www.baidu.com" onClick="this.target = window.top.popDialogUrl('dialogTwo', '第二层弹出', config)">点解弹出层</a>
|
function popDialogUrl(dialogId, title, config){
|
return popupDialog.openDialog(dialogId, title, config);
|
}
|
|
//关闭对话框
|
function hideDialog(dialogId){
|
window.top.popupDialog.closeDialog(dialogId);
|
}
|
/*--------------------------------------------------------------iframe对话框dialog方法(end)--------------------------------------------------------------*/
|
|
|
|
/*<div class="input_wrap">
|
<input type="text" />
|
<span>请输入</span>
|
</div>
|
inputVal('input_wrap', 'input');
|
<div class="textarea_wrap">
|
<textarea></textarea>
|
<span>请输入</span>
|
</div>
|
inputVal('textarea_wrap', 'textarea');*/
|
function inputVal(wrap, input){//input,textarea输入
|
var inputWrap = $('div.' + wrap);
|
inputWrap.each(function(i){
|
var $span = inputWrap.eq(i).children('span'),
|
$input = inputWrap.eq(i).children(input),
|
eleVal = $input.val();
|
if(eleVal != ''){
|
$input.show();
|
$span.hide();
|
};
|
$input.focus(function(){
|
$span.hide();
|
});
|
$input.blur(function(){
|
var thisVal = $(this).val();
|
if(thisVal == ''){
|
$span.show();
|
}else{
|
$span.hide();
|
}
|
});
|
$span.click(function(){
|
$(this).hide();
|
$input.focus();
|
});
|
});
|
}
|
