相关疑难解决方法(0)

\n
• 以下基于 Chrome 31 测试
\n
• TL;DR：为什么这个小提琴中的代码在尝试提交时有效，但在手动调用时却不起作用？有更好的方法吗？
\n

在回答一个要求验证其属性的方法的问题时<input type="file">accept（本机行为将与生成的文件对话框一起使用，默认情况下会显示一个过滤器，但它不是强制执行的），我想看看有哪些选项可以使用将此自定义验证集成到 HTML5 的脚本化约束验证中。

我最初对 API 的略读导致我覆盖了本机checkValidity方法，因为我相信只要浏览器认为适合验证代码（jsFiddle），就会默认调用该方法：

void function enhanceFileInputTypeValidityCheck(){\n    var inputPrototype      = document.createElement( \'input\' ).constructor.prototype;\n    var nativeCheckValidity = inputPrototype.checkValidity;\n\n    // This is my custom validation function\n    function validateFileInputType( input ){\n        var MIMEtype = new RegExp( input.accept.replace( \'*\', \'.\\*\' ) );\n\n        return Array.prototype.every.call( input.files, function passesAcceptedFormat( file ){\n            return MIMEtype.test( file.type );\n        } );\n …

我有这样的文件字段：

<input type="file" name="pic" accept="image/*">

当我单击并选择文件时它工作正常，但当我将文件拖放到其中时它接受所有类型的文件。

任何想法 ？

仅供参考：我已经通过添加服务器端验证解决了这个问题。