Home > Web Front-end > JS Tutorial > Let's talk about our views and understanding of Ajax form submission

Let's talk about our views and understanding of Ajax form submission

亚连
Release: 2018-05-23 11:31:14
Original
1861 people have browsed it

Ajax, asynchronous request, by exchanging a small amount of data with the server in the background, AJAX can make the web page update asynchronously. Through this article, I will talk to you about my views and understanding of ajax form submission. Friends who are interested can learn together

ajax (ajax development)

AJAX stands for "Asynchronous Javascript And XML" (asynchronous JavaScript and XML), which refers to a web development technology for creating interactive web applications.

AJAX = Asynchronous JavaScript and XML (a subset of Standard Universal Markup Language).

AJAX is a technology for creating fast, dynamic web pages.

By exchanging a small amount of data with the server in the background, AJAX can enable asynchronous updates of web pages. This means that parts of a web page can be updated without reloading the entire page.

I have been learning code for a long time, but I rarely use ajax. Later, I went to find out more about it. The following is my opinion and understanding of ajax as a newcomer who is new to ajax.

Ajax, asynchronous request, by exchanging a small amount of data with the server in the background, AJAX can make the web page update asynchronously. This means that parts of a web page can be updated without reloading the entire page.

Recently I tested the ajax form submission. There are two types of form submission: post and get. The post method is more used. Although compared with POST, GET is simpler and faster, and in most cases It works.

However, in the following situations, using POST requests is more efficient:

1. Cache files cannot be used (updating files or databases on the server)

2 .Send large amounts of data to the server (POST has no data volume limit)

3. When sending user input containing unknown characters, POST is more stable and reliable than GET

$get method submits the form

get() method loads information through remote HTTP GET request

Format

$(selector).get(url,data,success(response,status,xhr),dataType)
Copy after login

For example:

Request the demo.php web page, send 2 parameters, ignore the return value:

$.get("demo.php", { name: "John", time: "2pm" } );

demo.php is the URL address to send the request

{ name: “John”, time: “2pm” } The data to be sent to the server.

$POST method to submit the form

$.post

jQuery.post( url, [data], [callback], [type] ): Use POST method to perform Asynchronous request

Parameters:

url (String): URL address to send the request.

data (Map): (Optional) Data to be sent to the server, in Key/value representation in the form of key-value pairs.

callback (Function): (optional) Callback function when loading is successful (this method is called only when the return status of Response is success).

For example, when registering, the verification code used

<script type="text/javascript">
function redirect(url) {
location.href = url;
}
$("#code_btn").click(function(){
var tel = $("#username").val();
if(tel == ""){
alert("请输入正确的手机号码作为账号进行注册");
$("#username").focus();
return false;
}
if(!(/^1[3|4|5|8|7][0-9]\d{4,8}$/.test(tel))){
alert("请使用正确的手机号码作为账号进行注册!");
$("#username").focus();
return false;
};
var codeNum = $("#code").val();
$.post( &#39;{APP_PATH}index.php?m=member&c=index&a=public_send_message&#39;, {tel:tel,codeNum:codeNum}, function(result){
// console.log(result);
})
timep(60);
});
function timep(j){
$("#code_btn").attr(&#39;disabled&#39;,"true");
$("#code_btn").val(j+"秒");
time=setInterval(function(){
j=j-1;
$("#code_btn").val(j+"秒");
if(j==0){
$("#code_btn").removeAttr(&#39;disabled&#39;);
clearInterval(time);
j=60;
$("#code_btn").val("点击获取验证码");
}
},1000);
}
</script>
Copy after login

APP_PATH}index.php?m=member&c=index&a=public_send_message is the URL address for sending the request

{tel: tel,codeNum:codeNum} is the data to be sent to the server, expressed in the form of Key/value pairs.

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Write the example code of the map through the database and ajax method

Ajax gets the data through the city name

AJAX request queue implementation

The above is the detailed content of Let's talk about our views and understanding of Ajax form submission. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template