创建多个文件上传逻辑

我想在MVC应用程序中创建多个文件上传。我可以添加一个新的div 点击“添加”锚标签。但我只能点击父acnhor标记的事件，但不能使用下面的java脚本函数创建的事件。创建多个文件上传逻辑

View Page 
    <div id="ParentFileUploadDiv" style="width: 100%; float: left; padding: 5px 0;"> 
           <div style="width: 100%; float: left;" id="FileBlock_1"> 
            <label>Find File</label> 
            <input type="file" id="DocFile" name="DocumentFile" style="width: 45%; height: 25px;" /> 
            <a class="AddFile"> 
             <img src="~/Images/AddMore.png" />Add</a> 
            <a class="RemoveFile"> 
             <img src="~/Images/Cross.png" />Remove</a> 
            <div id="FileNM"></div> 
            @* <a class="DownloadImage" style="display: none !important;" title="Download File" id="DI_Anch" onclick="DownloadFile();"></a>*@ 
           </div> 
          </div> 

    <script> 
    $('.AddFile').click(function() { 

      var LastChildElement = $("#ParentFileUploadDiv").children().last(); 
      var GetLastNumber = LastChildElement.attr('id').split('_'); 
      var FileCounter = parseInt(GetLastNumber[1]) + parseInt(1); 
      var curDiv = $('#ParentFileUploadDiv'); 

      var newDiv = '<div id="FileBlock_' + FileCounter + '" style="width: 100%; float: left;" >' + 
         '<label>Find File</label>' + 
         '<input type="file" name="DocumentFile" style="width: 45%; height: 25px;" />' + 
         '<a class="AddFile">' + 
         '<img src="/Images/AddMore.png" />Add</a>' + 
         '<a class="RemoveFile">' + 
         '<img src="/Images/Cross.png" />Remove</a>' 
         + '</div>'; 
      $(newDiv).appendTo(curDiv); 

     }); 

     function RemoveFileUpload(div) { 
      document.getElementById("FileUploadContainer").removeChild(div.parentNode); 
     } 
    </script>

来源

2014-03-03 Sweetie

你必须使用委托作为在千元其他重复回答（'click'，'。AddFile'，function（）{...}）;'（'＃ParentFileUploadDiv'）。 –

代表事件最近静态父：

$('#ParentFileUploadDiv').on('click','.AddFile', function(){...});

来源

2014-03-03 13:56:47

这很难做..你有没有考虑过使用插件？

这一个是免费+容易实现：

http://www.uploadify.com/demos/

（它是基于Flash的..快速谷歌搜索将让你找到那些jQuery的/基于MVC不过话说这使用自己的人我可以保证它）

来源

2014-03-03 13:56:47

创建多个文件上传逻辑

回答

相关问题