thinkphp5.1使用layer插件來定制tp5的消息提示頁面


隨着thinkphp5新版本的發布,越來越多的開發者選擇使用它來開發項目,或許它現在還有些美中不足的地方,但也無傷大雅,今天給大家帶來的就是更換和定制屬於自己風格的success/error消息提示頁面,這一功能將使用layer彈出層插件來完成。

下載最新版本的tp5之后,它默認的success/error效果如下:

是非常原始簡潔的一個效果,但是對用戶體驗度不是很好。
通過下面博主的講解來進行稍做改變,可以變的很美觀,舒服,適用。
這里主要用到layer彈出層插件(不得不說,它近來很火,兼容性也不錯)。
從layer官方網站下載最新的版本后,放到項目中,在common.php中自定義一個方法alert,

/**
 * $msg 待提示的消息
 * $url 待跳轉的鏈接
 * $icon 這里主要有兩個,5和6,代表兩種表情(哭和笑)
 * $time 彈出維持時間(單位秒)
 */
function alert($msg='',$url='',$icon='',$time=3){ 
    $str='<script type="text/javascript" src="'.config('template.tpl_replace_string.__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;
}

然后就是控制器調用:

return alert('你無權修改!',url('hospital/index'),5,3);
return alert('操作成功!',url('hospital/index'),6);

效果如下:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM