複製上傳字段也值複製

我有以下的jQuery函數：複製上傳字段也值複製

makeupload = function() { 
    if (filecount == 7) { 
     alert('You can Only upload up to 10 files'); 
    } else { 
     filecount++; 
     var el = $('div#fileupload'); 
     el = el[el.length - 1]; 
     el = $(el); 
     var nel = el.clone(); 
     nel.val(''); 
     var fi = nel.find("#fileinput"); 
     fi.attr("name", "file[]"); 
     fi.val(''); 
     el.after(nel); 
     nel.show(); 
     fi.bind("change", function(e) { 
      makeupload(); 
     }); 
    } 
} 
makeupload();

在Firefox

只有它複製的最後一個字段的值，所以如果我瀏覽的圖像，然後使用添加一個新領域上面的函數，它複製新字段內的值。

下面是HTML文件：

<div id="fileupload" style=""><input type="file" name="file[]" /><br /></div>

來源

2011-11-05 Ahoura Ghotbi

請妥善縮進代碼下一次（我已經做到了你這段時間）。這不僅對我們來說是爲了幫助你，而是爲了你自己能夠閱讀你自己的代碼。 –

看起來您的克隆方法會創建重複的元素ID。我不確定這是否是上述問題的根源，但在任何情況下都是不好的做法。 –

我不知道你的代碼的當前狀態是什麼（上面的代碼不能工作，因爲它至少是），所以我冒昧重構你的功能。我還從標記中刪除了ID屬性，並用class屬性替換了它，因爲你實際上不應該克隆ID。

以下版本似乎work just fine在FF：

var max_upload = 10; 

var make_upload = function() { 
    var $uploads = $(".fileupload"); 

    if ($uploads.length >= max_upload) { 
     alert("You can only upload up to 10 files"); 

    } else { 
     var $last = $uploads.last(); 

     $last 
      .clone() 
      .insertAfter($last) 
      .find("input") 
      .val("") 
      .bind("change", function() { 
       make_upload(); 
      }); 
    } 
} 

make_upload();

來源

2011-11-05 19:28:12 polarblau

複製上傳字段也值複製

回答

相關問題