Sharing the usage of the plug-in to upload files asynchronously using jQuery-JS Tutorial-php.cn

Sharing the usage of the plug-in to upload files asynchronously using jQuery

小云云

Release： 2017-12-31 16:45:36

Original

1259 people have browsed it

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>

Copy after login

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>

Copy after login

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!