Simple example of $.post() method in jquery-JS Tutorial-php.cn

Simple example of $.post() method in jquery

巴扎黑

Release： 2017-07-03 10:28:29

Original

4902 people have browsed it

This article mainly introduces a simple example of the $.post() method in jquery. Friends who need it can come and refer to it. I hope it will be helpful to everyone.

There is such a method in jqery Method, $.post() Here is a simple example of this method:

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) The data to be sent to the server, expressed 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).

type (String) : (Optional) The official description is: Type of data to be sent. In fact, it should be the type requested by the client (JSON, XML, etc.)

1.html page (index.html)

The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Untitled Document</title>
<script type="text/javascript" src=\&#39;#\&#39;" /jquery-1.3.2.js"></script>
<script language="javascript">
function checkemail(){

  if($(&#39;#email&#39;).val() == ""){
    $(&#39;#msg&#39;).html("please enter the email!");
    $(&#39;#email&#39;).focus;
    return false;
  }
  if($(&#39;#address&#39;).val() == ""){
    $(&#39;#msg&#39;).html("please enter the address!");
    $(&#39;#address&#39;).focus;
    return false;
  }
  ajax_post();
}
function ajax_post(){
  $.post("action.php",{email:$(&#39;#email&#39;).val(),address:$(&#39;#address&#39;).val()},
  function(data){
    //$(&#39;#msg&#39;).html("please enter the email!");
    //alert(data);
    $(&#39;#msg&#39;).html(data);
  },
  "text");//这里返回的类型有：json,html,xml,text
}
</script>
</head>
<body>
<form id="ajaxform" name="ajaxform" method="post" action="action.php">
    <p>
    email<input type="text" name="email" id="email"/>

    </p>
    <p>
    address<input type="text" name="address" id="address"/>
    </p>
    <p id="msg"></p>
    <p>    
        <input name="Submit" type="button" value="submit" onclick="return checkemail()"/>
    </p>
</form>
</body>
</html>

Copy after login

2.php page (action.php)

The code is as follows:

<?php
$email = $_POST["email"];
$address = $_POST["address"];
//echo $email;
//echo $address;
echo "success";
?>

Copy after login

Description : When clicking the button, note that the current type of the button is button. When the $.post() method is not used, the button type is submit, so that submit submits the data in the form and uses the post method to pass it to the page. action.php, then the passed data can be received in the page action.php. When using the $.post method, we actually use the post method in the function ajax_post() method. (To reference the jquery library file)

The above is the detailed content of Simple example of $.post() method in jquery. For more information, please follow other related articles on the PHP Chinese website!