封装jquery ui 提示框

最新推荐文章于 2023-10-03 17:03:53 发布

原创最新推荐文章于 2023-10-03 17:03:53 发布 · 991 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

javascript 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种使用jQuery实现自定义对话框的方法，包括警告框和确认框两种类型。通过在页面DOM中动态创建对话框元素，并利用jQuery UI的dialog组件来定制样式和交互行为。

function alert(messa) {
	if ($("#dialogalert").length == 0) {
		$("body").append('<div id="dialogalert"></div>');
		$("#dialogalert").dialog({
			autoOpen : false,
			title : '消息框',
			modal : true,
			width : 300,
			closeOnEscape : true,
			buttons : {
				'关闭' : function() {
					$(this).dialog('close');
				}
			}
		});
	}
	$("#dialogalert").html(messa);
	$("#dialogalert").dialog('open');
}

function confirm(messa,callback) {
	if ($("#dialogconfirm").length == 0) {
		$("body").append('<div id="dialogconfirm"></div>');
		$("#dialogconfirm").dialog({
			autoOpen : false,
			title : '消息框',
			modal : true,
			width : 300,
			closeOnEscape : true,
			buttons:
            {
               '确定': function () {
                  $(this).dialog('close');
                  callback();
               },
               '取消': function () {
                  $(this).dialog('close');
               }
            }
		});
	}
	$("#dialogconfirm").html(messa);
	$("#dialogconfirm").dialog('open');
}