使用layer插件来定制tp5的消息提示页面

出处：http://www.dawnfly.cn/article-1-314.html

随着thinkphp5新版本的发布，越来越多的开发者选择使用它来开发项目，或许它现在还有些美中不足的地方，但也无伤大雅，今天破晓博主给大家带来的就是更换和定制属于自己风格的success/error消息提示页面，这一功能将使用layer弹出层插件来完成。

下载最新版本的tp5之后，它默认的success/error效果如下：

是非常原始简洁的一个效果，但是对用户体验度不是很好。

通过下面博主的讲解来进行稍做改变，可以变的很美观，舒服，适用。

这里主要用到layer弹出层插件（不得不说，它近来很火，兼容性也不错）。

从layer官方网站下载最新的版本后，放到项目中，在Common.php中自定义一个方法alert，

1 2 3 4 5 6 7 8 9 10 11

/**   * $msg 待提示的消息   * $url 待跳转的链接   * $icon 这里主要有两个，5和6，代表两种表情（哭和笑）   * $time 弹出维持时间（单位秒）   */ function  alert( $msg = '' , $url = '' , $icon = '' , $time =3){       $str = '<script type="text/javascript" src="' .config( 'admin_static' ). '/lib/jquery/1.9.1/jquery.min.js"></script><script type="text/javascript" src="' .config( 'admin_static' ). '/lib/layer/2.1/layer.js"></script>' ; //加载jquery和layer      $str .= '<script>$(function(){layer.msg("' . $msg . '",{icon:' . $icon . ',time:' .( $time *1000). '});setTimeout(function(){self.location.href="' . $url . '"},2000)});</script>' ; //主要方法      return  $str ; }

然后就是控制器调用：

1	return  alert( '您好，欢迎光顾破晓博客！' , 'http://www.dawnfly.cn' ,6,3);

效果如下：

其实layer插件提供很多不错的特效，破晓博主这里说的只是冰山一角，需要大家亲自下载去研究一下。