您的位置:首页 > Web前端 > JQuery

用JQuery UI dialog实现Alert和Confirm功能

2009-10-14 11:45 537 查看
JQuery UI dialog虽然可以实现Alert和Confirm功能,但每次都要定义相关dialog内容是比较麻烦的。如果只需要简单的调用ShowMsg(’内容’)这样就会省上很多事情,其实只要在JQuery UI dialog的基础上做些简单的工作就可以了。
把功能封装到一个用户控件中,有需要直接引用就可以了。

<%@ Control Language="C#" AutoEventWireup="true" %>

<div id="AlertMessage" title="信息确认">

<p id="AlertMessageBody" class="msgbody"></p>

</div>

<div id="ConfirmMessage" title="信息提问">

<p id="ConfirmMessageBody" class="msgbody""></p>

</div>

<script>

$(document).ready(function() {

$('#AlertMessage').dialog({

autoOpen: false,

width: 300,

modal: true,

buttons: {

"取消": function() {

$(this).dialog("close");

}

}

});

$('#ConfirmMessage').dialog({

autoOpen: false,

width: 300,

modal: true,

buttons: {

"取消": function() {

$(this).dialog('close');

mDialogCallback(false);

},

"确定": function() {

$(this).dialog('close');

mDialogCallback(true);

}

}

});

});

var mDialogCallback;

function ShowMsg(msg, callback) {

if (callback == null) {

$('#AlertMessageBody').html(msg);

$('#AlertMessage').dialog('open');

}

else {

mDialogCallback = callback;

$('#ConfirmMessageBody').html(msg);

$('#ConfirmMessage').dialog('open');

}

};

</script>

这样以后使用起来就省些事了:

ShowMsg('是否提交活动信息?', function(yes) {

if (yes) {

}

});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: