码迷,mamicode.com
首页 > Web开发 > 详细

一百三十一:CMS系统之轮播图上传图片功能

时间:2019-12-01 19:06:17      阅读:141      评论:0      收藏:0      [点我收藏+]

标签:自动填充   系统   span   image   script   nbsp   comm   tp5   标签   

 

将七牛js放到common下

技术图片

把获取uptoken的接口放到common视图中

技术图片

把初始化七牛放到banners.js中

技术图片

//初始化七牛
$(function () {
qiniujs.setUp({
‘domain‘: ‘http://q1tp5a19s.bkt.clouddn.com/‘,
‘browse_btn‘: ‘upload-btn‘, //上传图片按钮的id
‘uptoken_url‘: ‘/common/uptoken/‘,
‘success‘: function (up, file, info) {
//把上传图片后的链接自动填充到输框中
var imageInput = $(‘input[name="image_url"]‘);
imageInput.val(file.name);
}
});
});

在页面中引用相关文件和标签

技术图片

<script src="https://cdn.staticfile.org/Plupload/2.1.1/moxie.js"></script>
<script src="https://cdn.staticfile.org/Plupload/2.1.1/plupload.dev.js"></script>
<script src="https://cdn.staticfile.org/qiniu-js-sdk/1.0.14-beta/qiniu.js"></script>
<script src="{{ static(‘common/qiniujs.js‘) }}"></script>

给添加图片按钮加一个id,对应js里面的id

技术图片

操作

技术图片

 

一百三十一:CMS系统之轮播图上传图片功能

标签:自动填充   系统   span   image   script   nbsp   comm   tp5   标签   

原文地址:https://www.cnblogs.com/zhongyehai/p/11966819.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!