A simple example of the $.post of method in jquery

  • 2020-03-30 01:35:44
  • OfStack

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

JQuery. Post (url, [data], [callback], [type]) :
Use POST to make asynchronous requests

Parameters:

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

Data (Map) : Optionally, the data to be sent to the server is represented as a key-value pair of Key/value.

The callback (Function) : (optional) the callback function is called on success (only if the Response returns a success).

Type (String) : The official description is: Type of data to be sent. Should be the type of client request (JSON,XML, etc.)

1. HTML page (index.html)


<!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='#'" /jquery-1.3.2.js"></script>
<script language="javascript">
function checkemail(){

  if($('#email').val() == ""){
    $('#msg').html("please enter the email!");
    $('#email').focus;
    return false;
  }
  if($('#address').val() == ""){
    $('#msg').html("please enter the address!");
    $('#address').focus;
    return false;
  }
  ajax_post();
}
function ajax_post(){
  $.post("action.php",{email:$('#email').val(),address:$('#address').val()},
  function(data){
    //$('#msg').html("please enter the email!");
    //alert(data);
    $('#msg').html(data);
  },
  "text");//The returned types are: 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>

2. PHP page (action. PHP)

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

Description: When you click the button, notice that the type of the button is now button. When you do not use the $.post() method, the type of the button is submit. In this way, submit submits the data in the form and passes it to the page action.php using the post method. When we use the $.post method, we use the post method in the function ajax_post() method. (to refer to the jquery library file)


Related articles: