好库文章 » 软件开发 » Web开发 » JS/Ajax

介绍：上次好库网中发布的一篇文章《jQuery UI 消息框(message box)的使用》 详细介绍了用jQuery UI组件实现消息框，现在我为大家介绍一个不用jQuery UI实现的消息框。

正文：

 

上次好库网中发布的一篇文章《jQuery UI 消息框(message box)的使用》

详细介绍了用jQuery UI组件实现消息框，现在我为大家介绍一个不用jQuery UI实现的消息框。

 

一、准备工作

1.1 添加jQuery和ui的JS支持

 

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="ui.js"></script>

1.2 添加CSS

 

<link rel="stylesheet" type="text/css" href="http://www.okbase.net/file/link?u=ui.css" />

1.3 Html中添加消息框输出div

 

<div id="show_message_area"></div>

二、应用实例

2.1 提示消息框

MessageBox('notice','任务进行中...', '这是标题');

2.2 警告消息框

MessageBox('warning', '请输入内容');

2.3 确认选择对话框

options = {'onClickYes':function(){location.href = "外链网址已屏蔽www.okbase.net";}};
MessageBox('confirm', "你确定访问好库编程网吗？", '提示', options);

2.4 自动消失的提示对话框

show_message('自动消失的提示框');

默认消失时间为3秒，可以指定消失时间，如：

show_message('5秒自动消失', 5);

2.5 Ajax取得HTML作为对话框内容

showDialog('mydialog1', 'ajax', '发送信息', {url:'ajaxtest.html'}, 590);

 

下载源代码：外链网址已屏蔽www.okbase.net/file/item/20619

评论 [发表评论]

账号 密码 还没帐号呢，现在注册一个？

 评 论