jquery 用a标签控制文件上传

发布网友发布时间：2022-05-06 19:46

共2个回答

热心网友时间：2022-04-22 18:06

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>ajaxFileUpload文件上传例子</title>
<script type="text/javascript" src="<%=baseURL%>/kinth/js/ajaxfileupload.js"></script>
<script type="text/javascript">
   var flag=0;      //flag作用：分两种情况提交信息，如果是修改操作，没有修改上传文件，只修改其他字段的信息时点保存也能提交信息
    function uploadFile(){
        $.ajaxFileUpload({
                url:baseURL+ "/fileCatalog.do?method=save",            //需要链接到服务器地址
                secureuri:true,
                fileElementId:'file',                        //文件选择框的id属性
                success: function(data, status){
                    var results = $(data).find('body').html();
                    var obj = eval("("+results+")");
                    $("#fileSize").val(obj.fileSize);
                    $("#fileUrl").val(obj.fileUrl);
                    $('#fileCatalogForm').submit();
                },error: function (data, status, e){
                        showDialogWithMsg('ideaMsg','提示','文件错误！');
                }
            });
    }

    function getFileName(obj)
    {
        flag=1;
            var pos = -1;
            if(obj.value.indexOf("/") > -1){
                pos = obj.value.lastIndexOf("/")*1;
        }else if(obj.value.indexOf("\\") > -1){
                pos = obj.value.lastIndexOf("\\")*1;
        }
        var fileName =  obj.value.substring(pos+1);
        $("#fileName").val(fileName);
      $('.files').text(fileName);
    }

        function ev_save(){
            if(submitMyForm('fileCatalogForm')){
             if(flag==0){
                $('#fileCatalogForm').submit();
             }else{
                uploadFile();
             }
           }
         }

         function ev_back(){
        window.location.href=baseURL+'/fileCatalog.do?method=list';
    }
</script>
</head>
<body>
    <html:form styleId="fileCatalogForm" action="/fileCatalog.do?method=save&fileFlag=true" method="post" enctype="application/x-www-form-urlencoded" style="text-align:left;">
    <table>
        <tr>
            <td>附件上传：</td>
            <td style="text-align:left;"  id="fileTd">
                <input type="file" name="file" id="file" onChange="getFileName(this);"  /><br />
            </td>
            <td colspan="2" class="tdr">
                <ol  class=files>
                    <c:if test="${entity.resourceId != null && entity.resourceId != ''}"><li> ${entity.fileName}  上传成功</li></c:if>
                </ol>
            </td>
        </tr>
        <c:if test="${entity.resourceId == null || entity.resourceId == ''}">
            <input type="text" name="fileSize" id="fileSize" >
        </c:if>
        <input type="hidden" id="fileUrl" name="fileUrl" value="${entity.fileUrl}"
    </table>
    </html:form>
</body>

热心网友时间：2022-04-22 19:24