This article has shared the specific code for jQuery+ThinkPHP to implement image upload for your reference. The specific content is as follows
1. Use js to implement real-time preview of relevant code when uploading pictures
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Preview selected pictures</title>
<script src="/jquery/2.1.4/"></script>
</head>
<body>
<input type="file" onchange="showSelectedImages()" >
<br/>
<div ></div>
</body>
<script>
= || ;
/**
* Show selected file preview
* @param {[type]} files Selected file
*/
function showSelectedImages(files) {
var fileList = ('fileList');
if (isImageByType(files[0].type)) {
var img = '<img src="' + (files[0]) + '" style="width:200px;">';
$('#fileList').html(img);
}else{
alert('Please select a picture');
}
}
/**
* Determine whether the file is a picture
* @param {[type]} fileType file
* @return {Boolean}
*/
function isImageByType(fileType) {
return ("image") < 0 ? false : true;
}
</script>
</html>
2. Use jQuery's Ajax to upload image forms
var formData = new FormData();
('file', $('#uploadimg')[0].files[0]); //Add the parameters for image information("ewmclass",ewmclass);
("uname",uname);
("skaccount",skaccount);
$.ajax({
url: "/User/ewmup",
type: "post",
dataType: "json",
cache: false,
data: formData,
processData: false,// No data processing contentType: false, // Don't set content type success: function (mes) {
if( == 1){
msg_alert(,);
}else{
msg_alert();
}
}
});
3. ThinkPHP upload file related code
//Upload pictures$upload = new \Think\Upload();// Instantiate the upload class$upload->maxSize = 3145728 ;// Set the attachment upload size$upload->exts = array('jpg','jpeg','png','gif');// Set the attachment upload type$upload->rootPath = './Uploads/'; // Set up attachment upload root directory$upload->savePath = 'ewm_img/'; // Set up attachment upload (sub) directory// Upload file$info = $upload->upload();
if(!$info) {// Upload error message echo $upload->getError()
exit;
}
echo 'The file upload directory is: /Uploads/'.$info['file']['savepath'].$info['file']['savename'];
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.