logo标签列表

在Internet Explorer中尝试上传不存在的文件，表单未提交。

internet-exploreruploadsubmit
4

我有一个包含input type=file的表单。在Internet Explorer中，用户可以输入任何他们想要的内容到该输入框中（而Firefox会弹出文件选择器）。如果用户输入一个明显无效的名称，例如：

a

当用户尝试提交表单时，Internet Explorer甚至不会尝试提交表单。

有没有办法让我知道发生了这种情况，并通过警报让用户知道正在发生什么？

3个回答
1

我找到了更好的方法来做这个： http://www.priddypictures.co.uk/reference/fileInputProblem.htm

所以，如果那些人是对的，如果输入没有名称属性，则表单可以正常提交：

  • 编写一个 jQuery 插件（如果是在 Internet Explorer 中），将删除所有文件输入的名称属性
  • 在表单中插入另一个隐藏输入并赋予正确的名称
  • 将文件输入的值复制到隐藏输入中

我可能会在某个时候编写这个插件。

1

你应该给提交按钮添加一个"onclick()"事件，调用一个JavaScript函数来测试你的条件，并使用JavaScript的"alert"来告知用户需要输入一些值得提交的内容。

研究一下正则表达式来进行测试。

如果你希望用户做出决定，可以使用confirm()。

如果你只想简单地提醒他们而不测试他们的值，可以使用类似以下的方法：

<input type="submit" value="clickme" onClick="if (confirm('Really submit?')) { this.form.submit(); }">

这里是一些示例代码，可以让您从JavaScript函数调用中获取值，在onclick()中：

<html>
    <head>
        <title>hello world</title>
        <SCRIPT LANGUAGE="javascript" type="text/javascript">
            function show_me(form_elem) {
            alert(form_elem.value);
            }
        </script>
    </head>
    <body>
        <form method="GET" name="upload_form" action="index.html" target="_top">
            <input type="file" name="file_name" size="14" maxlength="256" value="">
            <br>
            <input type="submit" value="mybutton" onclick="show_me(this.form.file_name)" />
        </form>
    </body>
</html>
出于安全考虑，JavaScript 无法访问<input type=file>的值。 - TJ L
@tj111：JavaScript 可以在主流浏览器中读取<input type=file>的值，但出于安全考虑无法设置它。 - Grant Wagner
同意。我的修订答案有证据。 - madcolor
它也不一定会读取整个文件名... “a” 可能是完全有效的，除了检查它不是空字符串之外，你真的无法做任何事情来“验证”文件名。 - bobince
将验证放在提交按钮的点击事件中是不可靠的，因为表单可以通过其他方式进行提交。而在事件本身中调用submit()可能会导致重复提交的问题。请让form.onsubmit返回true以允许提交，或者返回false以拒绝提交。 - bobince
0
您可以使用以下方法模仿Firefox行为：
<input type="file" name="test" onkeypress="this.click();return false;">

当用户尝试在文件输入框中输入时，它会弹出文件选择器。

显然，如果客户端禁用了JavaScript，这将无法工作，但根据您的要求，这可能已经足够好了。

在IE 6、7和8中似乎可以正常工作。

在Firefox 3中可以正常工作（因为它不允许在<input type=file>中输入）。

在Windows 3和4的Safari中可以正常工作（因为它不允许在<input type=file>中输入）。

在允许在<input type=file>中输入的Opera 9中，它不起作用（不弹出选择器或吞咽按键）。实际上，onkeypress事件似乎根本没有触发，可能是出于安全考虑。

在Firefox 2中无法工作（允许在<input type=file>中输入），因为this.click()不会弹出选择器，而return false会吞咽按键。

在IE6中，对文件输入字段调用.click()会破坏表单。您可以选择文件，但是表单将无法提交，就像OP所说的那样。 - bobince
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接