好库网 好库网首页 | 我的好库
JQuery入门

jQuery消息提示框的简单实现

发布者:jquery2000
发布日期:2013/2/18 16:41:32   更新日期:2013/2/18 17:07:58
阅读次数:4652
评分:4.80
介绍:上次好库网中发布的一篇文章《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="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 = "http://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);

 

下载源代码:http://www.okbase.net/file/item/20619


评论 [发表评论]
账号 密码 还没帐号呢,现在注册一个?

免责声明:好库网所展示的信息由买卖双方自行提供,其真实性、准确性和合法性由信息发布人负责。好库网不提供任何保证,并不承担任何法律责任。