救命呀，各位大哥快救救小第吧。只要有人帮我解决我给500分（多文件上传并多图预览的功能）

１、只显示一个按钮你可以通过ＭＳ的透明滤镜把 type=file 透明掉并放在你的按钮上。
２、上传多幅图片，那你就用多个 type=file 的控件，预先放在网页里。
３、只上传图片，你可以在客户端用脚本判断上传的文件的后缀名。
４、预览，最简单了，直接在页面里 createElement("IMG") 定制高宽显示用户点击的图片。
５、删除要上传的文件，可以用脚本把 type=file 里的 value 清空，脚本没法子写但有法子清空

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="Microsoft FrontPage 5.0">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD> <SCRIPT LANGUAGE="JavaScript">
    <!--
    function debug(info) {
    //alert(info);
    }function getAttachFileId( Idx ) {
    return "attachfile" + Idx; 
    }
    function getAttachInfoId( Idx ) {
    return "idAttachInfo" + Idx;
    }
    function getAttachOperId( Idx ) {
    return "idAttachOper" + Idx;
    }
    function getAttachBrId ( Idx ) {
    return "idAttachBr" + Idx;
    }var attaIdx = 0;
    var attaNameS = new Array();
    var ExistAttaInfo = new Array();function selectUploadFile() {
    var attaTagName = getAttachFileId( attaIdx );
    var attachFileTag = "<input type=file style='display:none' name='" + attaTagName + "' id='" + attaTagName +"' onchange='syncinfo();'>";
    var fileObj = document.getElementById( attaTagName );if (fileObj == null) {
    debug("fileObj is null");
    fileObj = document.createElement(attachFileTag);
    idAttaSpan.appendChild(fileObj);
    }fileObj.click();
    return;
    }function setAttachInfo() {
    var objId = getAttachFileId( attaIdx );
    var attaName = document.getElementById(objId).value;
    var attachFileId = getAttachFileId( attaIdx );
    debug( 'setAttachInfo , attaIdx: ' + attaIdx + ' attaName: ' + attaName );
    if (attaName == null || attaName == "" ) {
    alert('请选择一个文件');
    deletenode( idAttaSpan, attachFileId);
    return false;
    }
    if ( checkFileExist( attaName ) ) {
    alert('该图片已经存在，您不能再进行选择。');
    debug(' delete node ' + attachFileId );
    deletenode( idAttaSpan, attachFileId);
    return false;
    }
    attaNameS[attaIdx] = attaName;
    attaName = getfilename(attaName);
    genAttachInfo( attaIdx, attaName );
    attaIdx ++;
    return;
    }function genAttachInfo( Idx, theName ) {
    debug( ' gen Attach Info ' + Idx + ', the Name is ' + theName );
    var attaInfoTag = "<span id='" + getAttachInfoId( Idx ) + "'>";
    var attaOperTag = "<span id='" + getAttachOperId( Idx ) + "' onclick='deleteAttach(" + Idx + ");' style='color:blue;cursor:hand'>";
    var attaBrTag = "<br id='" + getAttachBrId( Idx ) + "'>";var aInfoElement = document.createElement(attaInfoTag);
    var aOperElement = document.createElement(attaOperTag);
    var brElement = document.createElement(attaBrTag);idAttaInfoArea.appendChild(aInfoElement);
    idAttaInfoArea.appendChild(aOperElement);
    idAttaInfoArea.appendChild(brElement);aOperElement.innerHTML = "&nbsp;&nbsp;<U>删除</U>";
    var re = /\\\\/g;
    aInfoElement.innerText = theName.replace(re, '\\');
    debug(idAttaInfoArea.innerHTML);
    return;
    }function deleteAttach(Idx) 
    {
    debug('delete ' + Idx + ' : ' + attaNameS[Idx]);
    attaNameS[Idx] = "";
    deletenode( idAttaSpan, getAttachFileId( Idx ));
    deletenode( idAttaInfoArea, getAttachInfoId( Idx ));
    deletenode( idAttaInfoArea, getAttachOperId( Idx ));
    deletenode( idAttaInfoArea, getAttachBrId( Idx ));
    }function checkFileExist( attaName ) {
    debug( 'attaName = ' + attaName);
    if ( attaNameS.length <= 0 && ExistAttaInfo.length <= 0 ) return false;for (var i=0; i<attaNameS.length; i++) {
    var theName = attaNameS[i];
    if ( theName != null && theName != "" && theName == attaName ) {
    debug( " it's the same with attaNameS " + i );
    return true;
    }
    }
    for (var i=0; i<ExistAttaInfo.length; i++) {
    var theName = ExistAttaInfo[i];
    if ( theName != null && theName != "" && theName == getfilename(attaName) ) {
    debug( " it's the same with ExistAttaInfo " + i );
    return true;
    }
    }
    return false;
    }function getfilename( attaName ) {
    var s = attaName.lastIndexOf( '\\' );
    return attaName.substr(s+1, attaName.length - s -1);
    }function deletenode( P, CID) 
    {
    var attas = P.childNodes;
    var i;
    for (i=0; i<attas.length; i++ ) {
    var oChild = P.children(i);
    if (oChild.id == CID) {
    P.removeChild(oChild);
    }
    }
    }function syncinfo( ) {
    idAttachSyncer.click();
    }
    //-->
    </SCRIPT>
    <BODY>
    <span name="idAttachSyncer" id="idAttachSyncer" height=0 onclick="setAttachInfo();"></span><FORM name="uploadTest" METHOD=POST ACTION="" enctype="multipart/form-data">
    <span id="idAttaInfoArea"></span>
    <INPUT TYPE="button" value="选择图片" onClick="selectUploadFile()">
    <span id="idAttaSpan"></span></FORM></BODY>
    </HTML>
      

  2.   

    并不是什么世态炎凉，技术论坛更多是技术交流，而不是代人coder，更多的是授道，解惑而不是替人捉刀。今天即使我给你写了code，但又遇到其它的问题呢？或者功能改进呢？又得重新给你写一遍？你自己若是不懂，你可以自己慢慢学，毕竟ＪＳ又不是什么难的东西，一周也就差不多了，并且这里也有很多的人会帮助你学习；但自己不懂，又不想学，只想坐享他人成果，那就只能说你好吃懒做了。
      

  3.   

    同意小梅观点。不过对初学者还是不要太苛求了。
    ///////之间为增加代码，楼主看看是否适用。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="Microsoft FrontPage 5.0">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD> <SCRIPT LANGUAGE="JavaScript">
    <!--
    function debug(info) {
    //alert(info);
    }function getAttachFileId( Idx ) {
    return "attachfile" + Idx; 
    }
    function getAttachInfoId( Idx ) {
    return "idAttachInfo" + Idx;
    }
    function getAttachOperId( Idx ) {
    return "idAttachOper" + Idx;
    }
    function getAttachBrId ( Idx ) {
    return "idAttachBr" + Idx;
    }var attaIdx = 0;
    var attaNameS = new Array();
    var ExistAttaInfo = new Array();//////////////////////////
    currentfileObj=null;
    //////////////////////////
    function selectUploadFile() {
    var attaTagName = getAttachFileId( attaIdx );
    var attachFileTag = "<input type=file style='display:none' name='" + attaTagName + "' id='" + attaTagName +"' onchange='syncinfo();'>";
    var fileObj = document.getElementById( attaTagName );if (fileObj == null) {
    debug("fileObj is null");
    fileObj = document.createElement(attachFileTag);
    idAttaSpan.appendChild(fileObj);
    ///////////////////////////
    currentfileObj=fileObj;
    ///////////////////////////
    }fileObj.click();
    return;
    }function setAttachInfo() {
    var objId = getAttachFileId( attaIdx );
    var attaName = document.getElementById(objId).value;
    var attachFileId = getAttachFileId( attaIdx );
    debug( 'setAttachInfo , attaIdx: ' + attaIdx + ' attaName: ' + attaName );
    if (attaName == null || attaName == "" ) {
    alert('请选择一个文件');
    deletenode( idAttaSpan, attachFileId);
    return false;
    }
    if ( checkFileExist( attaName ) ) {
    alert('该图片已经存在，您不能再进行选择。');
    debug(' delete node ' + attachFileId );
    deletenode( idAttaSpan, attachFileId);
    return false;
    }
    attaNameS[attaIdx] = attaName;
    attaName = getfilename(attaName);
    genAttachInfo( attaIdx, attaName );
    attaIdx ++;
    return;
    }function genAttachInfo( Idx, theName ) {
    debug( ' gen Attach Info ' + Idx + ', the Name is ' + theName );
    var attaInfoTag = "<span id='" + getAttachInfoId( Idx ) + "'>";
    var attaOperTag = "<span id='" + getAttachOperId( Idx ) + "' onclick='deleteAttach(" + Idx + ");' style='color:blue;cursor:hand'>";
    var attaBrTag = "<br id='" + getAttachBrId( Idx ) + "'>";var aInfoElement = document.createElement(attaInfoTag);
    var aOperElement = document.createElement(attaOperTag);
    var brElement = document.createElement(attaBrTag);idAttaInfoArea.appendChild(aInfoElement);
    idAttaInfoArea.appendChild(aOperElement);
    idAttaInfoArea.appendChild(brElement);aOperElement.innerHTML = "&nbsp;&nbsp;<U>删除</U>";
    var re = /\\\\/g;
    aInfoElement.innerText = theName.replace(re, '\\');
    /////////////////////////
    aInfoElement.innerHTML+="<img src="+currentfileObj.value+">";
    /////////////////////////
    debug(idAttaInfoArea.innerHTML);
    return;
    }function deleteAttach(Idx) 
    {
    debug('delete ' + Idx + ' : ' + attaNameS[Idx]);
    attaNameS[Idx] = "";
    deletenode( idAttaSpan, getAttachFileId( Idx ));
    deletenode( idAttaInfoArea, getAttachInfoId( Idx ));
    deletenode( idAttaInfoArea, getAttachOperId( Idx ));
    deletenode( idAttaInfoArea, getAttachBrId( Idx ));
    }function checkFileExist( attaName ) {
    debug( 'attaName = ' + attaName);
    if ( attaNameS.length <= 0 && ExistAttaInfo.length <= 0 ) return false;for (var i=0; i<attaNameS.length; i++) {
    var theName = attaNameS[i];
    if ( theName != null && theName != "" && theName == attaName ) {
    debug( " it's the same with attaNameS " + i );
    return true;
    }
    }
    for (var i=0; i<ExistAttaInfo.length; i++) {
    var theName = ExistAttaInfo[i];
    if ( theName != null && theName != "" && theName == getfilename(attaName) ) {
    debug( " it's the same with ExistAttaInfo " + i );
    return true;
    }
    }
    return false;
    }function getfilename( attaName ) {
    var s = attaName.lastIndexOf( '\\' );
    return attaName.substr(s+1, attaName.length - s -1);
    }function deletenode( P, CID) 
    {
    var attas = P.childNodes;
    var i;
    for (i=0; i<attas.length; i++ ) {
    var oChild = P.children(i);
    if (oChild.id == CID) {
    P.removeChild(oChild);
    }
    }
    }function syncinfo( ) {
    idAttachSyncer.click();
    }
    //-->
    </SCRIPT>
    <BODY>
    <span name="idAttachSyncer" id="idAttachSyncer" height=0 onclick="setAttachInfo();"></span><FORM name="uploadTest" METHOD=POST ACTION="" enctype="multipart/form-data">
    <span id="idAttaInfoArea"></span>
    <INPUT TYPE="button" value="选择图片" onClick="selectUploadFile()">
    <span id="idAttaSpan"></span></FORM><input onclick="alert(document.all.idAttaSpan.innerHTML)"></BODY>
    </HTML>