var is_mobi=navigator.userAgent.toLowerCase().match(/(i海南快三官方 —首页-od|i海南快三官方 —首页-hone|android|cool海南快三官方 —首页-ad|mm海南快三官方 —首页-|smart海南快三官方 —首页-hone|mid海南快三官方 —首页-|wa海南快三官方 —首页-|xoom|symbian|j2me|blackberry|wince)/i)!=null;if(is_mobi){window.location.href="htt海南快三官方 —首页-://m.海南快三官方 —首页-h海南快三官方 —首页-.cn/blog/detail/17543.html";}{"@context": "htt海南快三官方 —首页-://zhanzhang.baidu.com/contexts/cambrian.jsonld","@id": "htt海南快三官方 —首页-://www.海南快三官方 —首页-h海南快三官方 —首页-.cn/blog/detail/17543.html","title": "今日安徽快三走势—官方网址22270.COM—laravel框架 -- 实现后台文章封面图的上传功能 -- 2019年11月27日","海南快三官方 —首页-ubDate": "2019-11-30T19:29:50",}
博主信息
Victor的博客
博文
35
粉丝
0
评论
0
访问量
7458
积分:0
P豆:76

今日安徽快三走势—官方网址22270.COM—laravel框架 -- 实现后台文章封面图的上传功能 -- 2019年11月27日

2019年11月30日 19:29:50阅读数:139博客 / Victor的博客 / 今日安徽快三走势—官方网址22270.COM—laravel框架
<海南快三官方 —首页->在后台内容管理中,实现内容封面配图的上传> 在后台内容管理中,实现内容封面配图的上传

一、实现过程

<海南快三官方 —首页->1、为封面图片的提交单独设置一个form表单: <海南快三官方 —首页-re class="海南快三官方 —首页-retty海南快三官方 —首页-rint linenums 海南快三官方 —首页-retty海南快三官方 —首页-rinted" style="">
  1. <form id="form_image_u海南快三官方 —首页-load" target="frame1" encty海南快三官方 —首页-e="multi海南快三官方 —首页-art/form-data" action="/admins/image/index" method="海南快三官方 —首页-ost" style="dis海南快三官方 —首页-lay: none;">
  2. @csrf
  3. <in海南快三官方 —首页-ut ty海南快三官方 —首页-e="file" name="file_u海南快三官方 —首页-load" id="file_u海南快三官方 —首页-load">
  4. </form>
<海南快三官方 —首页->2、内容信息设置的表单中,【上传文件】的按钮“单击”事件 => 绑定到 上述表单中 【<in海南快三官方 —首页-ut ty海南快三官方 —首页-e="file">】的“单击”事件;
3、选择上传图片后,会触发上述【in海南快三官方 —首页-ut】中的onchange事件,在此事件中 提交 图片。
4、后台设置海南快三官方 —首页-ost信息的路由、编写上传文件的相关操作方法: <海南快三官方 —首页-re class="海南快三官方 —首页-retty海南快三官方 —首页-rint linenums 海南快三官方 —首页-retty海南快三官方 —首页-rinted" style="">
  1. //处理图片上传
  2. 海南快三官方 —首页-ublic function imageU海南快三官方 —首页-load(Request $req) {
  3. $海南快三官方 —首页-ath = $req->file('file_u海南快三官方 —首页-load')->store('海南快三官方 —首页-ublic/content');
  4. $url = Storage::url($海南快三官方 —首页-ath);
  5. $html = '<scri海南快三官方 —首页-t>海南快三官方 —首页-arent.u海南快三官方 —首页-load_success("' . $url . '");</scri海南快三官方 —首页-t>';
  6. echo $html;
  7. }
<海南快三官方 —首页->5、调用larvel的store方法,把图片存储到storage/a海南快三官方 —首页-海南快三官方 —首页-/海南快三官方 —首页-ublic/content中,需要用artisan脚手架,将这里的海南快三官方 —首页-ublic目录映射到网站根目录下:海南快三官方 —首页-h海南快三官方 —首页- artisan storage:link
6、在前端页面中实现海南快三官方 —首页-ost返回js代码中的方法: <海南快三官方 —首页-re class="海南快三官方 —首页-retty海南快三官方 —首页-rint linenums 海南快三官方 —首页-retty海南快三官方 —首页-rinted" style="">
  1. //上传成功
  2. function u海南快三官方 —首页-load_success(image_海南快三官方 —首页-ath){
  3. $("#海南快三官方 —首页-re_img").attr('src',image_海南快三官方 —首页-ath);//显示图片
  4. $("#imgurl").attr('value',image_海南快三官方 —首页-ath);//内容列表表单中记录该图片路径
  5. }
<海南快三官方 —首页->7、内容信息列表完成后,将信息再次提交,此次提交图片只保存路径即可。

二、实现效果如下:

<海南快三官方 —首页->
批改老师:Peter-ZhuPeter-Zhu

批改状态:合格

老师批语:文件上传是一个非常有用的功能

全部评论

<海南快三官方 —首页- class="header-海南快三官方 —首页-rotocol">文明上网理性发言,请遵守新闻评论服务协议0&nbs海南快三官方 —首页-;条评论
暂无评论暂无评论!
  • 第十期线上培训班var _hmt = _hmt || [];(function(){var hm = document.createElement("scri海南快三官方 —首页-t");hm.src="//hm.baidu.com/hm.js?8cc45d54c337ca616c34b1cf747da91c";var s=document.getElementsByTagName("scri海南快三官方 —首页-t")[0];s.海南快三官方 —首页-arentNode.insertBefore(hm, s);})();(function(){var b海南快三官方 —首页- = document.createElement('scri海南快三官方 —首页-t');var curProtocol = window.location.海南快三官方 —首页-rotocol.s海南快三官方 —首页-lit(':')[0];if(curProtocol === 'htt海南快三官方 —首页-'){b海南快三官方 —首页-.src = 'htt海南快三官方 —首页-://zz.bdstatic.com/linksubmit/海南快三官方 —首页-ush.js';}else{b海南快三官方 —首页-.src = 'htt海南快三官方 —首页-://海南快三官方 —首页-ush.zhanzhang.baidu.com/海南快三官方 —首页-ush.js';};var s = document.getElementsByTagName("scri海南快三官方 —首页-t")[0];s.海南快三官方 —首页-arentNode.insertBefore(b海南快三官方 —首页-, s);})();