Copyright 2013-2014 All Rights Reserved Theme by www.warewashingadvisors.com 版權(quán)所有
AB模板網(wǎng)(www.warewashingadvisors.com)專(zhuān)注企業(yè)網(wǎng)站模板制作,包括企業(yè)pbootcms網(wǎng)站模板,靜態(tài)網(wǎng)頁(yè)模板,網(wǎng)站源碼下載,HTML網(wǎng)站模板等等。XML地圖 網(wǎng)站地圖 今日更新
免責(zé)聲明:本站所有資源(模板、圖片)搜集整理于互聯(lián)網(wǎng)或者網(wǎng)友提供,僅供學(xué)習(xí)與交流使用,如果不小心侵犯到你的權(quán)益,請(qǐng)及時(shí)聯(lián)系我們刪除該資源。
話(huà)不多說(shuō),直接上圖上代碼–這里以上傳圖片為例!其他文件自行修改
首先引入layui框架
<link rel="stylesheet" href="{pboot:sitetplpath}/layui/css/layui.css?v=v2.5.4"> <script type="text/javascript" src="{pboot:sitetplpath}/layui/layui.all.js?v=v2.5.4"></script> |
<div class="form-group"> <label for="mobile">頭 像</label> <div> <input type="text" name="ico" id="ico" placeholder="請(qǐng)上傳縮略圖" class="layui-input"> <button type="button" class="layui-btn upload" data-des="ico"> <i class="layui-icon"></i>上傳圖片 </button> <div id="ico_box"></div> </div> </div> <script> layui.use(['element','upload'], function(){ var element = layui.element; var upload = layui.upload; //執(zhí)行單圖片實(shí)例 var uploadInst = upload.render({ elem: '.upload' //綁定元素 ,url: '/index.php?p=/index/upload' //上傳接口 ,field: 'upload' //字段名稱(chēng) ,multiple: false //多文件上傳 ,accept: 'images' //接收文件類(lèi)型 images(圖片)、file(所有文件)、video(視頻)、audio(音頻) ,acceptMime: 'image/*' ,done: function(res){ var item = this.item; layer.closeAll('loading'); //關(guān)閉loading if(res.code==1){ $('#ico').val(res.data[0]); $('#ico_box').html("<img src='"+res.data[0]+"' width=80 >"); layer.msg('上傳成功!'); }else{ layer.msg('上傳失。'+res.data); } } ,error: function(){ layer.closeAll('loading'); //關(guān)閉loading layer.msg('上傳發(fā)生錯(cuò)誤!'); } }); }); </script> |
打開(kāi)apps/home/controller/IndexController.php
新增上傳入口函數(shù)
public function upload() { $upload = upload('upload'); if (is_array($upload)) { json(1, $upload); } else { json(0, $upload); } } |
后臺(tái)對(duì)應(yīng)的改成圖片展示或者其他形式
注意:前端上傳功能會(huì)影響網(wǎng)站的安全性,容易導(dǎo)致網(wǎng)站被入侵,如非必須情況不建議使用此功能。