关于easydialog 使用方法和问题

2019独角兽企业重金招聘Python工程师标准>>>

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