Home >Web Front-end >JS Tutorial >FileUpload implements single file upload

FileUpload implements single file upload

php中世界最好的语言
php中世界最好的语言Original
2018-04-04 16:55:042224browse

This time I will bring you FileUpload to realize the upload of a single file. What are the precautions for FileUpload to realize the upload of a single file. The following is a practical case, let's take a look.

jQuery.AjaxFileUpload.js is a jQuery plug-in for uploading files through ajax.

Syntax:

$.ajaxFileUpload([options])

options Parameter description:

1 , url     Upload handler address.​

2, fileElementId ​​ The ID of the file field that needs to be uploaded, that is, the ID of .

3, secureuri     Whether to enable secure submission, the default is false.

4, dataType     The

data type returned by the server. Can be xml, script, json, html. If you don't fill it in, jQuery will automatically determine it.

5, success is a processing function that is automatically executed after successful submission. The parameter data is the data returned by the server.

6, error     The processing function that is automatically executed if the submission fails.

7, data Custom parameters. This thing is more useful. When there is data related to the uploaded

picture, this thing will be used.

8, type When you want to submit custom parameters, this parameter should be set to post

Function features:

It doesn't rely on specific HTML, just give it an "< INPUTTYPE= "file" >

It doesn't require your server to respond in any specific way

Can work on large batches File operation

Sample code:

-- Use as little as --
$('#one-specific-file').ajaxfileupload({
'action': '/upload.php'
});
-- or as much as --
$('input[type="file"]').ajaxfileupload({
'action': '/upload.php',
'params': {
'extra': 'info'
},
'onComplete': function(response) {
console.log('custom handler for file:');
alert(JSON.stringify(response));
},
'onStart': function() {
if(weWantedTo) return false; // cancels upload
},
'onCancel': function() {
console.log('no file selected');
}
});
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

HTML5+Ajax file upload progress bar display (detailed graphic and text explanation)

js implements ajax paging (picture Detailed explanation in the article)

AJAX realizes data paging without refreshing

The above is the detailed content of FileUpload implements single file upload. For more information, please follow other related articles on the PHP Chinese website!

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