;(function($) {
$.alerts = {
verticalOffset: -75,
horizontalOffset: 100,
repositionOnResize: true,
overlayOpacity: 0.50,
overlayColor: "#FFF",
draggable: true,
okButton: "确 定",
cancelButton: "取 消",
dialogClass: null,
alert: function(content, title, callback) {
if (title == null) {
title = "OK"
}
$.alerts._show(title, content, null, "alert",
function(e) {
if (callback) {
callback(e)
}
})
},
confirm: function(content, title, callback) {
if (title == null) {
title = "Are you sure"
}
$.alerts._show(title, content, null, "confirm",
function(e) {
if (callback) {
callback(e)
}
})
},
prompt: function(content, defaulevalue, title, callback) {
if (title == null) {
title = "Please enter something"
}
$.alerts._show(title, content, defaulevalue, "prompt",
function(f) {
if (callback) {
callback(f)
}
})
},
overShow: function(tips, seconds) {
if (seconds == null) {
seconds = 3000
}
var hide_seconds = seconds + 600;
$("body").append(‘<div id="over_container" style="display:none"><div id="over_message"></div></div>‘);
$("#over_message").text(tips).html($("#over_message").text().replace(/\n/g, "<br/>"));
if ($.alerts.dialogClass) {
$("#over_container").addClass($.alerts.dialogClass)
}
var position_type = ($.browser.msie && parseInt($.browser.version) <= 6) ? "absolute" : "fixed";
$("#over_container").css({
position: position_type,
zIndex: 99999,
width: 350,
padding: 0,
margin: 0
}).show("fast");
$("#over_container").css({
minWidth: $("#over_container").outerWidth(),
maxWidth: $("#over_container").outerWidth()
});
$.alerts._overReposition();
setTimeout(function() {
$("#over_container").hide("fast")
},
hide_seconds);
setTimeout(function() {
$("#over_container").remove()
},
hide_seconds)
},
_overReposition: function() {
var top = 4;
var left = (($(window).width() / 2) - ($("#over_container").outerWidth() / 2)) + $.alerts.horizontalOffset;
if (top < 0) {
top = 0
}
if (left < 0) {
left = 0
}
if ($.browser.msie && parseInt($.browser.version) <= 6) {
top = top + $(window).scrollTop()
}
if ($.browser.msie && parseInt($.browser.version) <= 6) {
left = left - 175
}
$("#over_container").css({
top: top + "px",
left: left + "px"
});
$("#popup_overlay").height($(document).height())
},
_show: function(title, content, defaulevalue, type, callback) {
$.alerts._hide();
$.alerts._overlay("show");
$("body").append(‘<div id="popup_container" style="display:none"><h1 id="popup_title"></h1><span id="popup_close"></span><div id="popup_content"><div id="popup_message"></div></div></div>‘);
if ($.alerts.dialogClass) {
$("#popup_container").addClass($.alerts.dialogClass)
}
var i = ($.browser.msie && parseInt($.browser.version) <= 6) ? "absolute" : "fixed";
$("#popup_container").css({
position: i,
zIndex: 99999,
padding: 0,
margin: 0
}).show();
$("#popup_title").text(title);
$("#popup_content").addClass(type);
if (type != "openBox") {
$("#popup_message").text(content).html($("#popup_message").text().replace(/\n/g, "<br />"))
}
$("#popup_container").css({});
$.alerts._reposition();
$.alerts._maintainPosition(true);
switch (type) {
case "alert":
$("#popup_message").after(‘<div id="popup_panel"><input type="button" value="‘ + $.alerts.okButton + ‘" id="popup_ok" /></div>‘);
$("#popup_ok").click(function() {
$.alerts._hide();
callback(true)
});
$("#popup_ok").focus().keypress(function(h) {
if (h.keyCode == 13 || h.keyCode == 27) {
$("#popup_ok").trigger("click")
}
});
break;
case "confirm":
$("#popup_message").after(‘<div id="popup_panel"><input type="button" value="‘ + $.alerts.okButton + ‘" id="popup_ok" /> <input type="button" value="‘ + $.alerts.cancelButton + ‘" id="popup_cancel" /></div>‘);
$("#popup_ok").click(function() {
$.alerts._hide();
if (callback) {
callback(true)
}
});
$("#popup_cancel").click(function() {
$.alerts._hide();
if (callback) {
callback(false)
}
});
$("#popup_ok").focus();
$("#popup_ok, #popup_cancel").keypress(function(h) {
if (h.keyCode == 13) {
$("#popup_ok").trigger("click")
}
if (h.keyCode == 27) {
$("#popup_cancel").trigger("click")
}
});
break;
case "prompt":
$("#popup_message").append(‘<br /><input type="text" size="30" id="popup_prompt" />‘).after(‘<div id="popup_panel"><input type="button" value="‘ + $.alerts.okButton + ‘" id="popup_ok" /> <input type="button" value="‘ + $.alerts.cancelButton + ‘" id="popup_cancel" /></div>‘);
$("#popup_prompt").width($("#popup_message").width() - 10);
$("#popup_ok").click(function() {
var inputValue = $("#popup_prompt").val();
$.alerts._hide();
if (callback) {
callback(inputValue)
}
});
$("#popup_cancel").click(function() {
$.alerts._hide();
if (callback) {
callback(null)
}
});
$("#popup_prompt, #popup_ok, #popup_cancel").keypress(function(h) {
if (h.keyCode == 13) {
$("#popup_ok").trigger("click")
}
if (h.keyCode == 27) {
$("#popup_cancel").trigger("click")
}
});
if (defaulevalue) {
$("#popup_prompt").val(defaulevalue)
}
$("#popup_prompt").focus().select();
break;
}
$("#popup_close").click(function() {
$.alerts._hide();
if (callback) {
callback()
}
});
if ($.alerts.draggable) {
try {
$("#popup_container").draggable({
handle: $("#popup_title")
});
$("#popup_title").css({
cursor: "move"
})
} catch (d) { }
}
},
_hide: function() {
$("#popup_container").remove();
$.alerts._overlay("hide");
$.alerts._maintainPosition(false)
},
_overlay: function(display) {
switch (display) {
case "show":
$.alerts._overlay("hide");
$("BODY").append(‘<div id="popup_overlay"></div>‘);
$("#popup_overlay").css({
position:
"absolute",
zIndex: 99998,
top: "0px",
left: "0px",
width: "100%",
height: $(document).height(),
background: $.alerts.overlayColor,
opacity: $.alerts.overlayOpacity
});
break;
case "hide":
$("#popup_overlay").remove();
break
}
},
_reposition: function() {
var top = (($(window).height() / 2) - ($("#popup_container").height() / 2)) + $.alerts.verticalOffset;
var left = (($(window).width() / 2) - ($("#popup_container").width() / 2)) + $.alerts.horizontalOffset;
if (top < 0) {
top = 0
}
if (left < 0) {
left = 0
}
if ($.browser.msie && parseInt($.browser.version) <= 6) {
top = top + $(window).scrollTop()
}
$("#popup_container").css({
top: top + "px",
left: left + "px"
});
$("#popup_overlay").height($(document).height())
},
_maintainPosition: function(if_reposition) {
if ($.alerts.repositionOnResize) {
switch (if_reposition) {
case true:
$(window).bind("resize", $.alerts._reposition);
break;
case false:
$(window).unbind("resize", $.alerts._reposition);
break
}
}
}
};
hiAlert = function(content, title, callback) {
$.alerts.alert(content, title, callback)
};
hiConfirm = function(content, title, callback) {
$.alerts.confirm(content, title, callback)
};
hiPrompt = function(content, defaulevalue, title, callback) {
$.alerts.prompt(content, defaulevalue, title, callback)
};
hiOvershow = function(tips, seconds) {
$.alerts.overShow(tips, seconds)
}
})(jQuery);
html页面中调用：
<body>
<div id="main">
<div class="demo" id="a1">
1、警告框
</div>
<div class="demo" id="a2">
2、确认框
</div>
<div class="demo" id="a3">
3、输入框
</div>
<div class="demo" id="a5">
4、提示条
</div>
</body>
</html>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type=‘text/javascript‘ src=‘js/jquery-ui.min.js‘></script>
<script type="text/javascript" src="js/jquery.alert.js"></script>
<script type="text/javascript">
$(function(){
$("#a1").click(function(){
hiAlert("欢迎来到www.17sucai.com","提示");
});
$("#a2").click(function(){
hiConfirm(‘你确认此操作吗?‘, ‘确认框‘, function(r) {
hiOvershow(‘你的反馈是: ‘ + r);
});
});
$("#a3").click(function(){
hiPrompt(‘请填写:‘, ‘默认值‘, ‘输入框‘, function(r) {
if( r ) hiOvershow(‘你填入的内容是"‘ + r+‘"‘);
});
});
$("#a5").click(function(){
hiOvershow(‘操作提示条信息‘,1500);
});
});
</script>
代码写的很好。学习下。源码会上传文件。
文件名是：自己修改的alert.rar
时间： 2024-10-12 12:55:56