jQuery：如何獲取文件上傳輸入字段的“值”

Question

是否可以使用javascript / jQuery確定用戶是否為特定輸入類型=“文件”字段選擇了文件？

我為ExpressionEngine（基於PHP的CMS）開發了一個自定義字段類型，允許用戶在Amazon S3上上傳和存儲他們的文件，但是最流行的EE托管服務設置了max_file_uploads限制為20.我想允許用戶上傳20個文件，再次編輯該條目以添加20個等等。不幸的是，在編輯條目時，初始的20個文件有一個“替換此圖像”文件輸入字段，似乎是在敲除上傳新圖像的可能性。 我希望在提交表單時通過javascript刪除任何未使用的文件輸入字段。

Answer 1

是 - 您可以讀取值，甚至可以根據需要綁定到change事件。

<html>
<head>
  <title>Test Page</title>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript">
  $(function()
  {
    $('#tester').change( function()
    {
      console.log( $(this).val() );
    });
  });
  </script>
</head>

<body>

<input type="file" id="tester" />

</body>
</html>

但是還有其他多上傳解決方案可以更好地滿足您的需求，例如bpeterson76發布。

Answer 2

此代碼將從表單中刪除所有空文件輸入，然后提交它：

HTML：

<form action="#">
  <input type="file" name="file1" /><br />
  <input type="file" name="file2" /><br />
  <input type="file" name="file3" /><br />
  <input type="file" name="file4" /><br />
  <input type="file" name="file5" /><br />

  <input type="submit" value="Submit" />
</form>

JavaScript的：

$(function() {
  $("form").submit(function(){
    $("input:file", this).filter(function(){
      return ($(this).val().length == 0);
    }).remove();
  });
});

示例： http ： //jsbin.com/axuka3/

Answer 3

這個上傳器非常適合我的目的： http ： //webdeveloperplus.com/jquery/ajax-multiple-file-upload-form-using-jquery/

使用它作為編碼基礎的好處是文件是異步上傳的，因此不需要一次限制為20個。 在用戶搜索時進行上傳有明確的UI好處。

如果你需要，調整大小也是一個非常好的功能！

jQuery：如何獲取文件上傳輸入字段的“值”

問題描述

3 個解決方案

解決方案1
19 已采納 2010-07-19 14:49:49

解決方案2
2 2010-07-19 15:08:54

解決方案3
0 2010-07-19 14:46:30

jQuery：如何獲取文件上傳輸入字段的“值”

問題描述

3 個解決方案

解決方案1 19 已采納 2010-07-19 14:49:49

解決方案2 2 2010-07-19 15:08:54

解決方案3 0 2010-07-19 14:46:30

解決方案1
19 已采納 2010-07-19 14:49:49

解決方案2
2 2010-07-19 15:08:54

解決方案3
0 2010-07-19 14:46:30