Home > Article > Web Front-end > Sharing the usage of the plug-in to upload files asynchronously using jQuery
Sharing the usage of the plug-in to upload files asynchronously using jQuery
- 小云云Original
- 2017-12-31 16:45:361217browse
Now I want to implement the function of using ajax to upload files, but I found that the ajax method that comes with Jquery can only upload the file name, but not the file; although submitting with form can upload the file, it requires refreshing the page. . . After multiple searches, I found an available jQuery plug-in, which just meets the requirements for asynchronous file upload. This article mainly introduces the detailed usage of the plug-in that uses jQuery to asynchronously upload files. Friends who need it can refer to it. I hope it can help everyone.
Code
jquery.form.js
Usage
This plug-in is based on form submission. We only need to write a form to submit files normally. For example:
<form id="myForm" action="comment.php" method="post" enctype="multipart/form-data"> <input type="file" name="name" /> <input type="submit" value="Submit Comment" /> </form>
Then add the following code in js:
<html>
<head>
<script src="jquery.js"></script>
<script src="jquery.form.js"></script>
<script>
$(document).ready(function() {
$('#myForm').ajaxForm(function(data) {
alert(data);
});
});
</script>
</head>
In this way, you can monitor the form submission event, turn it into ajax and send it to the background, and then transfer the information returned from the background from obtained from data. In this way, you can use ajax communication to transfer files.
Related recommendations:
Detailed explanation of form upload to implement asynchronous file upload with ajax
Detailed explanation of ajax fileupload asynchronous upload plug-in
Native js method to implement asynchronous file upload
The above is the detailed content of Sharing the usage of the plug-in to upload files asynchronously using jQuery. For more information, please follow other related articles on the PHP Chinese website!