Question

我有一个表单供用户上传图片，我想在上传之前验证该图片。所以我在互联网上找到了这个脚本，它的验证工作正常，但它没有显示错误信息。因为我不知道如何声明要显示的错误消息的元素。我只是学习javascript，它通常使用document.getElementById("demo").innerHTML = "Hello JavaScript";。但是这段代码非常先进，我无法弄清楚如何修复它。

这是我表单中的文件输入。我在第11行添加了<span class='error-message'></span>。我希望在此span元素中显示错误消息。

<?php
for($i=0;$i<6;$i++){
echo "<div style='padding-left:0' class=\"fileinput fileinput-new col-xs-12 col-sm-6 col-md-4\" data-provides=\"fileinput\">
        <div class=\"fileinput-new thumbnail\" style=\"width: 266px; height: 220px;\">
            <img src=\"../images/default_image.png\" alt=\"chọn ảnh\">
        </div>
    <div class=\"fileinput-preview fileinput-exists thumbnail\" style=\"width: 277px; height: 220px\"></div>
        <div>
            <span class=\"btn btn-default btn-file\"><span class=\"fileinput-new\">Select image</span><span class=\"fileinput-exists\">Change</span><input type=\"file\" onchange=\"getImg(this,500,'jpeg|png')\" id=\"file$i\" name=\"file[]\"></span>
            <a href=\"#\" class=\"btn btn-default fileinput-exists\" data-dismiss=\"fileinput\">Remove</a>
            <span class='error-message'></span>
        </div>
    </div>";
}
?>

这是java脚本代码：

<script>
function getImg(input,max,accepted){
var upImg=new Image(),test,size,msg=input.form;
msg=msg.elements[0].children[0];
return input.files?validate():
(upImg.src=input.value,upImg.onerror=upImg.onload=validate);
    "author: b.b. Troy III p.a.e";
function validate(){
    test=(input.files?input.files[0]:upImg);
    size=(test.size||test.fileSize)/1024;
    mime=(test.type||test.mimeType);

mime.match(RegExp(accepted,'i'))?
size>max?(input.form.reset(),msg.innerHTML=max+"KB Exceeded!"):
msg.innerHTML="Upload ready...":    
(input.form.reset(),msg.innerHTML=accepted+" file type(s) only!")
}
}
</script>

这是作者的这个脚本的工作演示：JSFIDDLE。我怎么能在我的情况下应用这个？

Answer 1

最简单的方法是：

在你的html替换：

<span class='error-message'></span>

使用：

<span id='error-message'></span>

在你的JS替换：

msg=msg.elements[0].children[0];

使用：

var msg=document.getElementById('error-message');

修复javacode以显示fileupload的错误消息

1 个答案: