登录  /  注册

关于ajaxupload上传插件的有关问题

php中文网
发布: 2016-06-13 12:09:19
原创
864人浏览过

关于ajaxupload上传插件的问题
http://www.zhangxinxu.com/php/200911/ajax-file-upload-get-file-path2.php

一个页面中间需要8个地方用到这个插件,我的解决思路如下:首先我给每个input加了一个click事件,来获取id值,同时把window.onload写成了一个方法,结果是每次要点击两次input才会弹出图片选择框,主要原因是除了自己加的click事件外,插件本身也加了一个click事件,由于自己水平有限没有办法修改ajaxupload.js中代码。
直接试了第二种方法,就是把现在window.onload中的内容根据每个id的不同写了8个,这时可以上传了,但是每次显示的时候都在最后一个input下面。
请问有什么办法可以解决这个问题吗?谢谢!
------解决思路----------------------
多个ajaxUpload同时用,
我试了试,我这能响应两个不同的按钮向不同的php文件发送文件,不知道能满足你的要求。

<html><br />	<head><br />		<title>ajaxupload上传</title><br />		<meta charset="utf-8"/><br />		<style type="text/css"><br />			.divMain{<br />				position:absolute;<br />				width:140px;<br />				height:100px;<br />				padding-left:60px;<br />				padding-top:40px;<br />				background-color:#ccddee;<br />			}<br />			#upload{<br />				width:150px;<br />				height:30px;<br />			}<br />			.content{<br />				width:300px;<br />				height:200px;<br />			}<br />			.divMainNo2<br />			{<br />				position:absolute;<br />				left:300px;<br />				width:140px;<br />				height:100px;<br />				padding-left:60px;<br />				padding-top:40px;<br />				background-color:#ccddee;<br />			}<br />			<br /><br />		</style><br />		<script type="text/javascript" src="./jquery-1.8.2.min.js"></script><br />		<script type="text/javascript" src="./ajaxupload.js"></script><br />	</head><br />	<body><br />		<div class="divMain"><br />			<button id="upload">文件上传</button><br />			<div class="content"></div><br />		</div><br />		<div class="divMainNo2"><br />			<button id="uploadNo2">文件上传</button><br />			<div class="contentNo2"></div><br />		</div><br />	</body><br />	<script type="text/javascript"><br />		/*<br />				ajaxupload上传<br />			*/<br />		   $(document).ready(function(){<br />			    var button = $('#upload'), interval;<br />			    var fileType = "all",fileNum = "one"; <br />			    new AjaxUpload(button,{<br />			        action: './upload.php',<br />			        name: 'userfile',<br />			        onSubmit : function(file, ext){<br />			            if(fileType == "pic")<br />			            {<br />			                if (ext && /^(jpg<br><font color='#FF8000'>------解决思路----------------------</font><br>png<br><font color='#FF8000'>------解决思路----------------------</font><br>jpeg<br><font color='#FF8000'>------解决思路----------------------</font><br>gif)$/.test(ext)){<br />			                    this.setData({<br />			                        'info': '文件类型为图片'<br />			                    });<br />			                } else {<br />			                    $('<li></li>').appendTo('.files').text('非图片类型文件,请重传');<br />			                    return false;               <br />			                }<br />			            }<br />			            button.text('文件上传中');<br />			            if(fileNum == 'one')<br />			                this.disable();<br />			            interval = window.setInterval(function(){<br />			                var text = button.text();<br />			                if (text.length < 14){<br />			                    button.text(text + '.');                    <br />			                } else {<br />			                    button.text('文件上传中');             <br />			                }<br />			            }, 200);<br />			        },<br />			        onComplete: function(file, response){//上传成功的函数;response代表服务器返回的数据<br />							//清楚按钮的状态<br />							button.text('文件上传');<br />				            window.clearInterval(interval);<br />				            this.enable();<br />							//修改下方div的显示文字<br />						if('success'==response){<br />							$(".content").text("上传成功");<br />						}else{<br />							$(".content").text("上传失败");<br />						}<br />			        }<br />					});<br />					<br />				var buttonNo2 = $('#uploadNo2'), interval;<br />			    var fileType = "all",fileNum = "one"; <br />			    new AjaxUpload(buttonNo2,{<br />			        action: './upload1.php',<br />			        name: 'userfile',<br />			        onSubmit : function(file, ext){<br />			            if(fileType == "pic")<br />			            {<br />			                if (ext && /^(jpg<br><font color='#FF8000'>------解决思路----------------------</font><br>png<br><font color='#FF8000'>------解决思路----------------------</font><br>jpeg<br><font color='#FF8000'>------解决思路----------------------</font><br>gif)$/.test(ext)){<br />			                    this.setData({<br />			                        'info': '文件类型为图片'<br />			                    });<br />			                } else {<br />			                    $('<li></li>').appendTo('.files').text('非图片类型文件,请重传');<br />			                    return false;               <br />			                }<br />			            }<br />			            button.text('文件上传中');<br />			            if(fileNum == 'one')<br />			                this.disable();<br />			            interval = window.setInterval(function(){<br />			                var text = button.text();<br />			                if (text.length < 14){<br />			                    button.text(text + '.');                    <br />			                } else {<br />			                    button.text('文件上传中');             <br />			                }<br />			            }, 200);<br />			        },<br />			        onComplete: function(file, response){//上传成功的函数;response代表服务器返回的数据<br />							//清楚按钮的状态<br />							button.text('文件上传');<br />				            window.clearInterval(interval);<br />				            this.enable();<br />							//修改下方div的显示文字<br />						if('haha'==response){<br />							$(".contentNo2").text("上传成功");<br />						}else{<br />							$(".contentNo2").text("上传失败");<br />						}<br />			        }<br />					});<br />			});<br />	</script><br /></html>
登录后复制

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号