电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

jQuery+PHP實現圖片上傳并提交功能

瀏覽:107日期:2022-09-09 14:30:20

圖片上傳思路:通過ajax實現圖片上傳,然后把PHP返回的圖片地址,加入到隱藏字段中,最后通過表單提交給后臺PHP,代碼如下

HTML代碼 zimg.html文件:

<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <title>自定義上傳圖片</title></head><body> <form action='a.php?action=2' method='post'> <span> 上傳圖片 </span> <span> <input type='file' name='img_url' accept='.jpg, .gif, .jpeg, .bmp, .png'/> <a onclick='UpLoadImg()'>上傳</a> <input type='hidden' name='url_data'/> </span> <br> <span> <input type='submit' value='提交'> </span> </form> </body><!-- 引入jq --><script src='https://code.jquery.com/jquery-3.0.0.min.js'></script><script> function UpLoadImg(){ //獲取上傳文件 var formData = new FormData(); formData.append(’img_url’, $(’#img_url’)[0].files[0]); console.log(formData) //提交后臺處理 $.ajax({ url: ’a.php?action=1’, type: ’POST’, cache: false, data: formData, dataType: 'JSON', processData: false, contentType: false }).done(function(res) { console.log(res.url); if(res.status == 1){ //賦值給字段 $(’#url_data’).val(res.url); alert(res.msg) }else{ alert(res.msg) } }).fail(function(res) { }); }</script></html>

后臺PHP代碼 a.php:

<?phpif($_GET[’action’] == 1){//上傳圖片接口 $img = $_FILES[’img_url’]; //獲取上圖片后綴 $type = strstr($img[’name’], ’.’); $rand = rand(1000, 9999); //命名圖片名稱 $pics = date('YmdHis') . $rand . $type; //上傳路徑 $pic_path = 'img/'. $pics; //移動到指定目錄,上傳圖片 $res = move_uploaded_file($img[’tmp_name’], $pic_path); if($res){ echo json_encode([’status’ => 1, ’msg’ => ’上傳成功’,’url’ => $pic_path]);exit; }else{ echo json_encode([’status’ => 0, ’msg’ => ’上傳失敗’]);exit; }}elseif($_GET[’action’] == 2){//提交文件表單 echo ’<pre>’; var_dump($_POST);}

最后實現效果如下:

jQuery+PHP實現圖片上傳并提交功能

ps:js代碼是使用jQuery的寫法,需引入jQuery代碼庫文件

到此這篇關于jQuery加PHP實現圖片上傳并提交實現詳解的文章就介紹到這了,更多相關jQuery加PHP實現圖片上傳并提交內容請搜索好吧啦網以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持好吧啦網!

標簽: PHP
相關文章:
主站蜘蛛池模板: 机房监控|动环监控|动力环境监控系统方案产品定制厂家 - 迈世OMARA | 合肥通道闸-安徽车牌识别-人脸识别系统厂家-安徽熵控智能技术有限公司 | 天津中都白癜风医院_天津白癜风医院_天津治疗白癜风 | 顺景erp系统_erp软件_erp软件系统_企业erp管理系统-广东顺景软件科技有限公司 | 水性漆|墙面漆|木器家具漆|水漆涂料_晨阳水漆官网 | 杭州代理记账多少钱-注册公司代办-公司注销流程及费用-杭州福道财务管理咨询有限公司 | 山东限矩型液力偶合器_液力耦合器易熔塞厂家-淄博市汇川源机械厂 | led全彩屏-室内|学校|展厅|p3|户外|会议室|圆柱|p2.5LED显示屏-LED显示屏价格-LED互动地砖屏_蕙宇屏科技 | 24位ADC|8位MCU-芯易德科技有限公司 | 展厅装修公司|企业展厅设计|展厅制作|展厅搭建—广州展厅装饰公司 | 细石混凝土泵_厂家_价格-烟台九达机械有限公司 | 不锈钢水管-不锈钢燃气管-卫生级不锈钢管件-不锈钢食品级水管-广东双兴新材料集团有限公司 | 江苏密集柜_电动_手动_移动_盛隆柜业江苏档案密集柜厂家 | 视频直播 -摄影摄像-视频拍摄-直播分发 | 固诺家居-全屋定制十大品牌_整体衣柜木门橱柜招商加盟 | 猪I型/II型胶原-五克隆合剂-细胞冻存培养基-北京博蕾德科技发展有限公司 | 游戏版号转让_游戏资质出售_游戏公司转让-【八九买卖网】 | 汝成内控-行政事业单位内部控制管理服务商| OLChemim试剂-ABsciex耗材-广州市自力色谱科仪有限公司 | 余姚生活网_余姚论坛_余姚市综合门户网站| 佛山市钱丰金属不锈钢蜂窝板定制厂家|不锈钢装饰线条|不锈钢屏风| 电梯装饰板|不锈钢蜂窝板不锈钢工艺板材厂家佛山市钱丰金属制品有限公司 | 上海皓越真空设备有限公司官网-真空炉-真空热压烧结炉-sps放电等离子烧结炉 | 淘趣英语网 - 在线英语学习,零基础英语学习网站 | 活性炭-蜂窝-椰壳-柱状-粉状活性炭-河南唐达净水材料有限公司 | 化工ERP软件_化工新材料ERP系统_化工新材料MES软件_MES系统-广东顺景软件科技有限公司 | 福建珂朗雅装饰材料有限公司「官方网站」 | 塑料异型材_PVC异型材_封边条生产厂家_PC灯罩_防撞扶手_医院扶手价格_东莞市怡美塑胶制品有限公司 | 广州二手电缆线回收,旧电缆回收,广州铜线回收-广东益福电缆线回收公司 | 东莞爱加真空科技有限公司-进口真空镀膜机|真空镀膜设备|Polycold维修厂家 | 换网器_自动换网器_液压换网器--郑州海科熔体泵有限公司 | 高清视频编码器,4K音视频编解码器,直播编码器,流媒体服务器,深圳海威视讯技术有限公司 | 硅胶布|电磁炉垫片|特氟龙胶带-江苏浩天复合材料有限公司 | 上海盐水喷雾试验机_两厢式冷热冲击试验箱-巨怡环试 | 合金ICP光谱仪(磁性材料,工业废水)-百科| 全自动翻转振荡器-浸出式水平振荡器厂家-土壤干燥箱价格-常州普天仪器 | 防爆电机生产厂家,YBK3电动机,YBX3系列防爆电机,YBX4节防爆电机--河南省南洋防爆电机有限公司 | 密集柜_档案密集柜_智能密集架_密集柜厂家_密集架价格-智英伟业 密集架-密集柜厂家-智能档案密集架-自动选层柜订做-河北风顺金属制品有限公司 | Duoguan 夺冠集团| 济南ISO9000认证咨询代理公司,ISO9001认证,CMA实验室认证,ISO/TS16949认证,服务体系认证,资产管理体系认证,SC食品生产许可证- 济南创远企业管理咨询有限公司 郑州电线电缆厂家-防火|低压|低烟无卤电缆-河南明星电缆 | 信阳网站建设专家-信阳时代网联-【信阳网站建设百度推广优质服务提供商】信阳网站建设|信阳网络公司|信阳网络营销推广 | 滚筒线,链板线,总装线,流水线-上海体能机电有限公司 |