Home >Web Front-end >JS Tutorial >Simple example of $.post() method in jquery

Simple example of $.post() method in jquery

巴扎黑Original: 2017-07-03 10:28:295046browse

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>

2.php page (action.php)

The code is as follows:

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

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!

Statement：

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

Previous article：jQuery ajax - getScript() method and getJSON methodNext article：jQuery ajax - getScript() method and getJSON method

See more

Simple example of $.post() method in jquery

Related articles