這次帶給大家,的注意事項有哪些,下面就是實戰案例,一起來看一下。
實作圖片顯示功能:layer
1.在這裡介紹一種layer前端元件
layer是一款口碑極佳的web彈層組件,她具備全方位的解決方案,
致力於服務各個水平段的開發人員,您的頁面會輕鬆地擁有豐富而友好的操作體驗。
官網下載網址:http://layer.layui.com/
# 或點選此處本站下載。
裡面有具體的使用方法
這裡要注意幾點:在使用layer前端元件之前,我們要引進layer的js檔
<script type="text/javascript" src=".../.../layer/layer/layer.js"></script> <script type="text/javascript" src=".../...//layer/layer/extend/layer.ext.js"></script>
注意:layer.js檔案應該在jquery後面引入,因為layer.js是基於jquery.js的!
# 2.json
# 實作圖片顯示功能還需要json:
具體的用法如下:
{ //您服务端接口需严格按照下述格式返回 "status": 1, //请求的状态,1表示成功,其它表示失败 "msg": "", //状态提示语 "title": "", //相册标题 "id": number型, //相册id "start": 0, //初始显示的图片序号,默认0 "data": [ //相册包含的图片,数组格式 { "name": "", //图片名 "pid": number型, //图片id "src": "", //原图地址 "thumb": "", //缩略图地址 "area": [638, 851] //原图宽高 } ] }
利用如:
StringBuilder str = new StringBuilder();
的append方法按照上面的連結起來,一定要準確
最後回傳的是如:
return str.toString();
具體的用法也可以到官方網站http://layer.layui.com/中查看
#相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是layer前端組件圖片顯示功能的詳細內容。更多資訊請關注PHP中文網其他相關文章!