Sharing detailed examples of the use of jQuery.form.js

Faced with the problem: After the form is submitted, the backend will return prompt information. However, the native HTML cannot obtain the data returned by the backend, resulting in such a situation: after submission, the page jumps, and the json data returned by the backend is displayed on a blank page, and the user experience is 0 points. This article mainly shares with you the use of jQuery.form.js, hoping to help everyone.

Solution: Use jquery.form.js

Steps

Customize the control submission function

var submitChange=function () {
    $("form").ajaxSubmit(function (message) {
      alert(message.text);
      window.location.href="/index" rel="external nofollow" ;
    });
    return false;
  }
  //这个函数一是处理了后端返回的数据，二是返回了一个false，阻断了原生submit事件的发生。

Transform the form form (add onsubmit event, return from Define the processing function)

<form action="/do" onsubmit="return submitChange();">
</form>

Finally

Be careful to import the Js file!

For example:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.2.1/jquery.form.min.js" integrity="sha384-tIwI8+qJdZBtYYCKwRkjxBGQVZS3gGozr3CtI+5JF/oL1JmPEHzCEnIKbDbLTCer" crossorigin="anonymous"></script>

Related recommendations:

jquery DataTable front and backend dynamic paging implementation method sharing

jquery loading Single file vue component method sharing

jquery click on the text content to enlarge and center the example sharing

The above is the detailed content of Sharing detailed examples of the use of jQuery.form.js. For more information, please follow other related articles on the PHP Chinese website!