从输入文件元素中获取值？答案

【问题标题】：Get Value from intput file element?从输入文件元素中获取值？
【发布时间】：2011-01-30 18:29:49
【问题描述】：

嗨，

我有一个如下所示的输入：

<input type="file" id="ModelViewAd.Files[0]" name="ModelViewAd.Files[0]" />

id 和 name 以这种方式设置，以便能够绑定到 viewclass (ASP.NET MVC2)。

当我尝试运行以下 jquery 命令来获取值时：

$('#ModelViewAd.Files[0]').val()

我没有定义？

我做错了什么？

致以最诚挚的问候

解决方案：这可以通过更改名称来解决（HTML4 不支持 [ 和 ]）。但是，如果您使用的是 HTML5，则可以通过使用如下转义字符来解决此问题：$('#ModelViewAd.Files\[0\]').val()。

【问题讨论】：

【解决方案1】：

您需要escape the period character (.) in the selector。否则，jQuery 会将您的选择器解释为查找 ID 为 ModelViewAd 且类为 Files[0] 的元素：

$('#ModelViewAd\\.Files[0]')

一旦您实际选择了一个元素（我假设您的选择器没有正确执行此操作），如果用户没有实际选择文件，.val() 方法可能仍会返回 undefined。

【讨论】：

谢谢，但我已经尝试过 $('#ModelViewAd\\.Files[0]').val() 并且这也给出了 undefined?
@SnowJim：$('#ModelViewAd\\.Files[0]').length 的值是多少？如果是0，那么您的选择器仍然没有正确写入。括号也可能会弄乱jQuery。您也可以尝试转义：$('#ModelViewAd\\.Files\\[0\\]')，但正如 Nathan 指出的那样，括号不是 HTML ID 中的有效字符 - 除非您使用的是 HTML5。
感谢 Matt，它确实适用于 $('#ModelViewAd\\.Files\\[' + i + '\\]').val().length，但对于我的应用程序尽可能兼容。我必须按照这里的描述做：haacked.com/archive/2010/07/16/…？但是最好使用默认的活页夹。

【解决方案2】：

没有错 - 这不受支持。这是浏览器中的一个安全限制，因此您无法推断出有关最终用户文件系统的任何信息。

【讨论】：

他应该能够选择元素，并至少通过val() 获取文件名。此处显示的另一个讨论表明这是成功的 (stackoverflow.com/questions/1299052/…) 所以他的设置有其他问题。
是的，我知道安全部分，但我是否应该无法检查输入是否已设置？我的想法是始终为用户提供一个空文件输入，如果一个被清除，那么另一个（最后一个可见的）将被隐藏。
我之前已经看到使用一些可用的 ajax 上传工具完成此操作，但在我真正研究过的所有情况下，他们都求助于使用 flash 来克服安全障碍。跨度>
是的 falsh 是我第一次实现的，但我的网站需要尽可能兼容，即使是智能手机（只要支持上传文件）

【解决方案3】：

. 字符不是id 属性的有效字符。 MVC 在名称字段中使用.，在id 中使用下划线。这可能是您无法使用 jquery 获取它的部分原因。

另外，在您的示例中，您向我们展示了名为 ModelViewAd.Files[8] 的元素，但试图在您的 jquery 选择器中选择 ModelViewAd.Files[3]。这不是问题的一部分，是吗？

【讨论】：

是的，但我必须使用 ModelViewAd.Files[x] 作为 id，否则默认活页夹将无法正确绑定到我的视图类。我已经尝试替换 .和 \\。正如马特鲍尔所建议的那样，但这会产生同样的问题。
SnowJim，如果您在id 中使用下划线，MVC 将为您正确绑定您的模型。它是用于模型绑定的name 属性（因此需要其中的点）。事实上，id 属性的值永远不会发送到服务器。如果您使用HtmlHelper 函数之一，您将看到它们发出id 并用下划线代替其中的点。
谢谢，但我已尝试从 .到_，这给了我完全相同的问题？
现在转义 [ 和 ] 像 '#FileUpload_Files\\\\[1\\\\]' 这样的字符，它会工作！
. 字符肯定是 ID 属性的有效字符。

【解决方案4】：

如果您的目标浏览器不支持 HTML5，那么当您在 ID 属性中使用 [ 和 ] 时，您使用的 HTML 无效。

因此，您不应期望浏览器之间的行为一致。

正如其他人指出的那样，. 与选择器引擎冲突，但它是有效的 HTML4。

【讨论】：

$('#ModelViewAd\\.Files\\[' + i + '\\]').val().length 确实有效，但我需要它与 HTML4 兼容。问题是 ASP.NET MVC2 要求按照我的方式命名它，否则它不会绑定到视图类。所以问题是我如何用 ASP.NET MVC2 解决这个问题？我想我可以在我的操作中将 IEnumerable 文件作为参数，如下所述：haacked.com/archive/2010/07/16/…，但如果可能的话，让它绑定到视图类会很好吗？

【解决方案5】：

我有一个简单的解决方案，而且效果很好首先将 id 更改为 ModelViewAd 然后使用 jQuery 你可以简单地获取文件对象为

$('#ModelViewAd').get(0).files;

【讨论】：