Home >Web Front-end >JS Tutorial >Image upload judgment and preview script effect examples_javascript skills

Image upload judgment and preview script effect examples_javascript skills

WBOY
WBOYOriginal
2016-05-16 17:26:35943browse
Copy code The code is as follows:



                                                                                                 -130px;cursor:pointer;"/>
var $$ = function(id) {
return "string" == typeof id ? document.getElementById(id) : id;
};
/*
Image verification
*/
//Verify uploaded image format
function checkupload(ele) {
var obj = $$("FileUploadImg");
var fileContentType = obj.value.match(/^(.*)(.)(.{1,8})$/)[3]; //This file type regular expression is very useful:) 
 if (fileContentType == 'gif' || fileContentType == 'jpeg' || fileContentType == 'png' || fileContentType == 'jpg') {
                                                                                                                                                     } else {
        alert('The format of the uploaded file is incorrect!'); function checkFileSize(ele) {
var maxSize = 100 * 1024;
//ie
if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
var fso ;
try {
fso = new ActiveXObject('Scripting.FileSystemObject');
var file = fso.GetFile(ele.value);
//alert(file.Size);
                                                                                                   . }
//firefox
else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
//alert(ele.files[0].fileSize);
return ele.files[0].fileSize < maxSize;
}
return false;
}
//Load preview image
function previewImage(ele) {
if (ele && checkupload(ele)) {
var imgDiv = $$("imgbox");
imgDiv.innerHTML = "";
imgDiv.style.width = "100px";
imgDiv.style .height = “125px”; Microsoft.AlphaImageLoader(sizingMethod = scale)";
                                                                         window. navigator.userAgent.indexOf("Firefox") >= 1) {
      imgDiv.innerHTML = "";
        } else {
                 imgDiv.innerHTML = "IE/Firefox browser Only supports image preview ";
}
} else {
        $$("FileUploadImg").value = ""; "";
                                     //alert('Reset upload control' );
}
}

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn