js多图上传
⑴ php开发微信jssdk接口 iphone手机当一次多图上传时，只有一张上传成功怎么回事，安
微信上传图片，只能递归方法上传多张，所以你可能是JS代码里只上传了一次
⑵ js 前端上传多张图片
可以用webuploader插件，上传成功后，服务端返回图片地址，客户端<img>显示图片
X关闭按钮这个得自己用css样式控制，点击X后，服务端删除图片，然后前端移除该X掉的图片
⑶ ueditor.config.js要怎么实现多图上传
方法如下：
import java.util.Scanner;
public class test{
public static void main(String[] args){
Scanner in=new Scanner(System.in);
System.out.print("n=");
long n=in.nextLong();
long sum=1;
for(int i=1;i<=n;i++)
{
⑷ 如何通过js完成多个文件的上传
HTML5 file组件的新属性
accept : 如果在file组件中增加这个属性就可以直接控制上传的文件类型了，实在是很方便。
multiple：是否允许选择多个文件
HTML5 页面代码修改后
<img width="400" height="250"/><br />
<input type="file" id="pic" name="pic" onchange="printFileInfo()" accept="image/*" multiple="multiple"/>
<input type="button" value="上传图片" onclick="uploadFile()" /><br />
<div id="parent">
<div id="son"></div>
</div>
accept 的值可以参阅：IANA MIME 类型（标准 MIME 类型的完整列表），如果使用的是DW开发的话，软件本身就有提示。
如果选择了多个文件，可以用JS做循环打印，看看文件的名称，类型和大小,看演示代码
function printFileInfo(){
var picFile = document.getElementById("pic");
var files = picFile.files;
for(var i=0; i<files.length; i++){
var file = files[i];
var div = document.createElement("div")
div.innerHTML = "第("+ (i+1) +") 个文件的名字："+ file.name +
" , 文件类型："+ file.type +" , 文件大小:"+ file.size
document.body.appendChild( div)
}
}
既然可以循环多文件的话，就可以尝试多文件上传了。
1、首先创建 XMLHttpRequest 对象
//这是全局变量。因为是示例，所以就没有判断浏览器类型，低版本IE这么写的话会出问题的
var xhr = new XMLHttpRequest()
2、上篇介绍了进度事件(Progress) ， 这次实现 progress 和 error 2个事件
error：在请求发生错误时触发。
对应上传时发生错误导致的上传失败：uploadFailed()
//上传失败
function uploadFailed(evt) {
alert("上传失败");
}
progress：在接收相应期间持续不断触发。
对应上传进度方法：onprogress()
/**
* 侦查附件上传情况 ,这个方法大概0.05-0.1秒执行一次
*/
function onprogress(evt){
var loaded = evt.loaded; //已经上传大小情况
var tot = evt.total; //附件总大小
var per = Math.floor(100*loaded/tot); //已经上传的百分比
$("#son").html( per +"%" );
$("#son").css("width" , per +"%");
}
最后就是上传方法了，注意上面的html代码中上传用的方法也需要改成这个uploadFile()方法才能正常使用。
//上传文件
function uploadFile() {
//将上传的多个文件放入formData中
var picFileList = $("#pic").get(0).files;
var formData = new FormData();
for(var i=0; i< picFileList.length; i++){
formData.append("file" , picFileList[i] );
}
//监听事件
xhr.upload.addEventListener("progress", onprogress, false);
xhr.addEventListener("error", uploadFailed, false);//发送文件和表单自定义参数
xhr.open("POST", "upload");
//记得加入上传数据formData
xhr.send(formData);
}
⑸ js：点击按钮上传图片，最多能上传3张，上传第4张给出提示，js怎么写
你的上传按钮是怎么操作的？是表单的submit还是单独的按钮onclick事件调用方法？
⑹ 几种js实现的动态多文件上传
方式一：事先写好多个input.在点击时才显示。也就是说上传的最大个数是写死了的。
html
<p>
<a href='#' onclick='javascript:viewnone(more1)'> 添加附件 </a>
<div id='more1' style='display:none'>
<input type="file" name="attach1" size="50"javascript:viewnone(more2)>
</span>
</div>
<div id='more2' style='display:none'>
<input type="file" name="attach2" size="50"'>
</div>
</p>
js
<SCRIPT language="javascript">
function viewnone(e){
e.style.display=(e.style.display=="none")?"":"none";
}
</script>
方式二:这种方式的动态多文件上传是实现了的，很简单的，不说废话看code
html
<input type="button" name="button" value="添加附件" onclick="addInput()">
<input type="button" name="button" value="删除附件" onclick="deleteInput()">
<span id="upload"></span>
js
<script type="text/javascript">
var attachname = "attach";
var i=1;
function addInput(){
if(i>0){
var attach = attachname + i ;
if(createInput(attach))
i=i+1;
}
}
function deleteInput(){
if(i>1){
i=i-1;
if(!removeInput())
i=i+1;
}
}
function createInput(nm){
var aElement=document.createElement("input");
aElement.name=nm;
aElement.id=nm;
aElement.type="file";
aElement.size="50";
//aElement.value="thanks";
//aElement.onclick=Function("asdf()");
if(document.getElementById("upload").appendChild(aElement) == null)
return false;
return true;
}
function removeInput(nm){
var aElement = document.getElementById("upload");
if(aElement.removeChild(aElement.lastChild) == null)
return false;
return true;
}
</script>
方式三：动态多文件上传，只是在oFileInput.click();这个地方，这样做就不能上传这个文件了，因为发现它在上传之时就把这个input中的文件置空了。很可能是为了安全着想吧！
另外还有一点就是说，click()只有在ie中才能正常运行。
虽说这种方式最终没能实现上传，但还是留下来参考，看看是否有人可以真正实现上传。
html
<A href="javascript:newUpload();">添加附件</A>
<TABLE width="100%" border="0" cellpadding="0" cellspacing="1">
<TBODY id="fileList"></TBODY>
</TABLE>
<DIV id="uploadFiles" style="display:block"></DIV>
js
<SCRIPT language="javascript">
//---新建上传
function newUpload(){
var oFileList = document.getElementById("fileList");
var fileCount = oFileList.childNodes.length + 1;
var oFileInput = newFileInput("upfile_" + fileCount);
if(selectFile(oFileInput)){
addFile(oFileInput);
}
}
//----选择文件
function selectFile(oFileInput){
var oUploadFiles = document.getElementById("uploadFiles");
oUploadFiles.appendChild(oFileInput);
oFileInput.focus();
oFileInput.click();//不能这样做，可能是为了安全着想吧！
var fileValue = oFileInput.value;
if(fileValue == ""){
oUploadFiles.removeChild(oFileInput);
return false;
}
else
return true;
}
//---新建一个文件显示列表
function addFile(oFileInput){
var oFileList = document.getElementById("fileList");
var fileIndex = oFileList.childNodes.length + 1;
var oTR = document.createElement("TR");
var oTD1 = document.createElement("TD");
var oTD2 = document.createElement("TD");
oTR.setAttribute("id","file_" + fileIndex);
oTR.setAttribute("bgcolor","#FFFFFF");
oTD1.setAttribute("width","6%");
oTD2.setAttribute("width","94%");
oTD2.setAttribute("align","left");
oTD2.innerText = oFileInput.value;
oTD1.innerHTML = '<A href="javascript:removeFile('+ fileIndex + ');">删除</A>';
oTR.appendChild(oTD1);
oTR.appendChild(oTD2);
oFileList.appendChild(oTR);
}
//---移除上传的文件
function removeFile(fileIndex){
var oFileInput = document.getElementById("upfile_" + fileIndex);
var oTR = document.getElementById("file_" + fileIndex);
uploadFiles.removeChild(oFileInput);
fileList.removeChild(oTR);
}
//---创建一个file input对象并返回
function newFileInput(_name){
var oFileInput = document.createElement("INPUT");
oFileInput.type = "file";
oFileInput.id = _name;
oFileInput.name = _name;
oFileInput.size="50";
//oFileInput.setAttribute("id",_name);
//oFileInput.setAttribute("name",_name);
//oFileInput.outerHTML = '<INPUT type=file id=' + _name + ' name=' + _name + '>';
//alert(oFileInput.outerHTML);
return oFileInput;
}
</SCRIPT>
⑺ js input file文件上传图片并展示
1 页面HTML内容
2 获取input[file]元素
3 对获取的file元素操作，也就是操作fileReader属性
1：Blob
2: File
3: FileList
4: FileReader
FileList ：
这里，默认状态下选择文件 每次files属性上FileList对象里只有一个file文件。
file对象中包含了name 文件名; size ; type 文件类型; lastModified 最后修改时间；
FileReader：异步读取本地文件内容；包括File 和Blob ；
创建FileReader对象;读取file文件
关于fileReader的几个属性：
FileReader.error 只读一个 DOMException 代表在读取文件中出现的错误。 FileReader.readyState 只读一个数字表明的状态FileReader。这是以下之一：
FileReader.result 只读文件的内容。该属性仅在读取操作完成后才有效，并且数据的格式取决于使用哪种方法来启动读取操作。
fileReader的几个事件处理程序：
1 . FileReader.onbort:在读取操作中止时触发。
2 . FileReader.onerror:在读取操作遇到错误时触发。
3 . FileReader.onload:在读取操作成功完成时触发。
4 . FileReader.onloadstart:在开始阅读时触发。
5 . FileReader.onloadend:无论是否成功 只要读取操作完成都会触发。
6 . FileReader.onprogress:阅读Blob内容时触发。
FileReader的方法：
1 . FileReader.abort();中止读取操作
2 . FileReader.readAsArrayBuffer();完成时result属性包含ArrayBuffer表示文件数据
3 . FileReader.readAsBinaryString();完成时result属性将包含来自文件的原始二进制数据作为字符串。
4 . FileReader.readAsDataURL();完成时result属性包含data：表示文本数据的URL；
5 . FileReader.readAsText();完成时result属性包含文本的内容作为文本字符串。
⑻ 求一款jQuery或js多图上传插件
多图上传没问题，但是想上传后可以删除，可以修改名称。这个只能你自己来实现。之前专门写了一个上传插件希望能帮到你
http://blog.csdn.net/sq111433/article/details/16872403
⑼ 我需要一个js或者jquery能批量上传图片+预览的功能。急~~~急~~~急~~
WebUploader项目，符合你的要求。
//文件上传过程中创建进度条实时显示。
uploader.on('uploadProgress',function(file,percentage){
var$li=$('#'+file.id),
$percent=$li.find('.progressspan');
//避免重复创建
if(!$percent.length){
$percent=$('<pclass="progress"><span></span></p>')
.appendTo($li)
.find('span');
}
$percent.css('width',percentage*100+'%');
});
//文件上传成功，给item添加成功class,用样式标记上传成功。
uploader.on('uploadSuccess',function(file){
$('#'+file.id).addClass('upload-state-done');
});
//文件上传失败，显示上传出错。
uploader.on('uploadError',function(file){
var$li=$('#'+file.id),
$error=$li.find('div.error');
//避免重复创建
if(!$error.length){
$error=$('<divclass="error"></div>').appendTo($li);
}
$error.text('上传失败');
});
//完成上传完了，成功或者失败，先删除进度条。
uploader.on('uploadComplete',function(file){
$('#'+file.id).find('.progress').remove();
});
更多细节，请查看js源码。
⑽ 求js多张图片上传，可预览右上角带删除图标的代码
可以用dropzone.js试试，官网： http://www.dropzonejs.com/，你看看就知道了。上面有一个demo，你试试