如何让我的html5功能不兼容警告使用javascript工作

How to get my html5 feature incompatibility warning to work using javascript

本文关键字：警告 javascript 工作 不兼容 功能 我的 html5      更新时间：2023-09-26

我在网页中添加了一个表单，允许上传多个文件。我添加了输入<input type="file" name="photo_upload[]" id="photo_upload" multiple="multiple" />。

我试图添加一个警告，只有当浏览器不支持多文件功能时，该警告才可见。我试过这个代码：

<script type="text/javascript">
var testrange=document.createElement("input")
testrange.setAttribute("multiple", "multiple")
if (testrange.multiple=="multiple"){
    document.getElementById('multiple_warning').style.display = 'none';
}
</script>
<div id="multiple_warning" style="background:#FFFF99; border:dashed; border-width:thin;">Sorry, but your browser does not support the multiple file upload feature.<br />
If you have more than one photo to send us, please send it after you recieved your comformation email.</div>

但不管怎样，它总是显示"multiple_warning"。我怎样才能让它正常工作？

您可以使用Modernizr来测试特定属性。这是一个开源、跨浏览器的HTML5检测库

if(Modernizr.input[attribute])){
    alert("Attribute exists");
}
else{
    //error handling
}

请参阅此处http://modernizr.com/docs/#input

检查控制台以查看为什么您的测试总是失败；）

testrange.setAttribute("multiple", "multiple")
console.log(testrange.multiple);

你可以用这个片段来检查这个功能

if (!("multiple" in testrange)) {
    alert("no multiple upload supported");
}

使用这个而不是您拥有的JavaScript：

var testrange = document.createElement("input")
if ("multiple" in testrange) {
    document.getElementById("multiple_warning").style.display = "none";
}

如果你正在进行大量的特征检测，可以考虑使用Modernizr来测试这些东西，而不是创建自己的测试。它可以解决很多棘手的问题，让你省去很多麻烦。

相关文章：