【消息提示组件】,兼容IE6/7&&FF2


Posted in Javascript onSeptember 04, 2007

作者:yemoo
来源:WWW.AJAXBBS.NET
发布日期:2007-09-03

原文地址:http://www.ajaxbbs.net/blog/post/100/

特别说明:这只是一个纯客户端使用的js组件,非服务端控件(如asp.net控件等),改组件只是为了美化消息提示。

PS:希望大家多提有实际价值的建议或意见,如果合适我会继续做完善修改。
===================================================================
      前段时间公司需要写的一个小组件,用于替代windows2000默认的灰色消息组件(alert/Confirm),由于公司开发的系统主要针对IE浏览器,所以开始的代码在ff下运行无效,今日打算拿出共享,为了尽少挨砖,花了将近一个小时将代码进行了兼容性的修改,目前在ie6.0和FF2.0下运行正常,其他浏览器未测,公司任务在身,懒得花大量时间整这个,满足多数需求即可。

组件简介:

1、调用方式进行二次分装,首先封装成类,然后将调用方法变成几个简单的方法调用,调用时无需再new了。调用方法明了简单。
2、兼容IE6.0&&FF2.0。
3、目前提供了三种四种皮肤,Vista、QQ、ExtBlue和BlackColl。有兴趣可以修改样式表文件定义新的皮肤。
4、提供四种消息类型。分别为消息提示、成功信息、错误信息、询问信息。
5、弹出消息框时屏蔽页面其它元素的操作,自动隐藏页面select及iframe下select(无限级select隐藏),并遮罩iframe等元素。
6、页面select控件状态还原时保持原状态,即如果原来select就是隐藏的,则消息框弹出并关闭后该select仍保持隐藏状态,而只显示原本显示的select。
7、消息组件弹出时屏蔽对键盘Tab键和空格键的操作(防止键盘操作页面元素),按下Enter键当作点击消息组件的“确定”按钮处理。

使用简介:
   1、首先在页面中引入ymPrompt.js。
   2、然后调用需要的消息函数:   
   (1)Alert(content,width,height,title,okFunc,cancelFunc)  //消息提示类型  
   (2)SucceedInfo(....) //成功信息类型
   (3)ErrorInfo(...) //错误信息类型
   (4)ConfirmInfo(....) //询问消息类型

  四个方法的参数完全相同:

   content:消息组件要显示的内容。
   width:消息框的宽度,不设定请置null,宽度自适应。
   height:消息框的高度,不设定请置null,高度自适应。
   title:消息组件标题
   okFunc:点击确定按钮时执行的函数的名称。
   CancelFunc:点击取消或关闭按钮时执行的函数的名称。 

查看演示: http://www.ajaxbbs.net/test/ymPrompt/demo.htm
说明:网络空间速度原因,首次打开演示可能图片加载较慢,请打开后稍后图片下载完毕或下载源码到本地查看演示。
源码下载请到此处: http://www.ajaxbbs.net/blog/post/100/

Javascript 相关文章推荐
jQuery动画animate方法使用介绍
May 06 Javascript
取得元素的左和上偏移量的方法
Sep 17 Javascript
jQuery中:last选择器用法实例
Dec 30 Javascript
JavaScript获取服务器时间的方法详解
Dec 11 Javascript
Vue form 表单提交+ajax异步请求+分页效果
Apr 22 Javascript
webpack源码之loader机制详解
Apr 06 Javascript
基于vue实现可搜索下拉框定制组件
Mar 26 Javascript
angularJs中跳转到指定的锚点实例($anchorScroll)
Aug 31 Javascript
vue 巧用过渡效果(小结)
Sep 22 Javascript
Angular4.0动画操作实例详解
May 10 Javascript
vue项目配置使用flow类型检查的步骤
Mar 18 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
一个用js实现控制台控件的代码
Sep 04 #Javascript
科讯商业版中用到的ajax空间与分页函数
Sep 02 #Javascript
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
Aug 31 #Javascript
给Javascript数组插入一条记录的代码
Aug 30 #Javascript
用javascript实现给出的盒子的序列是否可连为一矩型
Aug 30 #Javascript
Expandable "Detail" Table Rows
Aug 29 #Javascript
出现“不能执行已释放的Script代码”错误的原因及解决办法
Aug 29 #Javascript
You might like
PHP中for循环语句的几种变型
2006/11/26 PHP
PHP header函数分析详解
2011/08/06 PHP
解析在PHP中使用mysqli扩展库对mysql的操作
2013/07/03 PHP
PHP实现手机号码中间四位用星号(*)隐藏的自定义函数分享
2014/09/27 PHP
php简单实现MVC
2015/02/05 PHP
PHP实现支持SSL连接的SMTP邮件发送类
2015/03/05 PHP
Win10 下安装配置IIS + MySQL + nginx + php7.1.7
2017/08/04 PHP
PHP保留两位小数的几种方法
2019/07/24 PHP
from表单多个按钮提交用onclick跳转不同action
2014/04/24 Javascript
JavaScript中Cookies的相关使用教程
2015/06/04 Javascript
JavaScript头像上传插件源码分享
2016/03/29 Javascript
jquery easyui DataGrid简单示例
2017/01/23 Javascript
Javascript中八种遍历方法的执行速度深度对比
2017/04/25 Javascript
JS简单生成随机数(随机密码)的方法
2017/05/11 Javascript
vue多种弹框的弹出形式的示例代码
2017/09/18 Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
2018/06/02 Javascript
详解@angular/cli 改变默认启动端口两种方式
2018/11/29 Javascript
微信 jssdk 签名错误invalid signature的解决方法
2019/01/14 Javascript
Vue实现省市区三级联动
2020/12/27 Vue.js
Python实现随机生成有效手机号码及身份证功能示例
2017/06/05 Python
Python模拟三级菜单效果
2017/09/11 Python
简单谈谈python基本数据类型
2018/09/26 Python
详解Python3网络爬虫(二):利用urllib.urlopen向有道翻译发送数据获得翻译结果
2019/05/07 Python
对Pytorch中nn.ModuleList 和 nn.Sequential详解
2019/08/18 Python
如何在Django中使用聚合的实现示例
2020/03/23 Python
html5 拖拽及用 js 实现拖拽功能的示例代码
2020/10/23 HTML / CSS
瑞士首家网上药店折扣店:McDrogerie
2020/12/22 全球购物
生产现场工艺工程师岗位职责
2013/11/28 职场文书
平安工地建设方案
2014/05/06 职场文书
师范生自荐信模板
2014/05/28 职场文书
新手上路标语
2014/06/20 职场文书
声乐专业大学生职业生涯规划书:理想的未来需要自己去打造
2014/09/20 职场文书
学前班幼儿评语大全
2014/12/29 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
Java spring定时任务详解
2021/10/05 Java/Android
JavaScript前端面试组合函数
2022/06/21 Javascript