关于easydialog 使用方法和问题

easydialog 非常简洁的弹出层JS组件,相比于传统的alert(),有更好的用户体验,我们在使用时,只需要调用其已经定义好的方法,甚至可以自定义方法,和通过修改CSS文件,来改变不同的显示样式。

我们在使用easydialog 的过程中,需要注意以下几点:

1、Js文件的引用:我们在下载easydialog.zip的压缩包解压后,放到站点根目录的某个路径下,在需要用到easydialog的页面中引用其相关的JS文件,就能使用了,例如:

[javascript] view plaincopy

  1. <span style="font-size:18px;"><script type="text/javascript" src="/js/easydialog/easydialog.min.js"></script></span>  


在引入该easydialog的组件之后,我们就可以将自定义的JS方法文件引入进来

[javascript] view plaincopy

  1. <span style="font-size:18px;"><script src="/js/easydialog/easy_msg.js" type="text/javascript"></script></span>  


在该文件中我们可以这样定义一个方法:

[javascript] view plaincopy

  1. /*=====================弹出层,有提示信息, user for 用户修改信息=============================================*/  

  2. function msg(){  

  3.     easyDialog.open({  

  4.         container : {  

  5.             content : '<img src=\'images/login/success.png\' width=\'12px\' height=\'12px\'  /><strong>操作成功!</strong>,<br/>为了您的账号安全,<br/>请您重新登录并修改密码...<br/>该窗口将在10秒后关闭<br/>立即登录请点击这里>><a href=\'login.aspx\'>[登录]</a>'  

  6.         },  

  7.         autoClose : 10000  

  8.     });  

  9. }  

这里需要注意的是,在我们的页面在使用easydialog的组件的时候,需要将为easydialog定义的CSS文件引入到相应的页面中。否则,弹出层将不能显示其相应的样式。


转载于:https://my.oschina.net/leftheart/blog/479166

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值