Source: Internet
Author: User

First look at an instance

The code is as follows: Copy code

$ ("# Btn"). click (function (k ){
Var j = form. serializeArray (); // serialize name/value
$. Ajax ({
Url: "Another domain name/test. php ",
DataType: 'jsonp ',
Data: j,
Jsonp: 'jsonp _ callback ',
Success: function (json) {// returned json data
Json = json | {};
If (json. msg = 'err '){
Alert ( );
} Else if (json. msg = "OK "){
Alert ('submitted successfully ');
} Else {
Alert ('submission failed ');
Timeout: 3000

Php section:

The code is as follows: Copy code
$ Jsonp_callback = $ _ GET ['json_callback'];
// If correct
Echo $ jsonp_callback, '({"msg": "OK "})';
5. // if an error occurs
Echo $ jsonp_callback, '({"msg": "err", "info": "failed to send due to character issues "})';

//... It is worth noting that the jsonp method is used, and beforeSend/error cannot be used. Therefore, the verification implemented by js in beforeSend can only be performed by ajax on the server side. php has been verified above.

The domain name contains the following HTML file testjsonp.html:

The code is as follows:

The code is as follows: Copy code

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "">
<Html xmlns = "">
<Title> Untitled Page </title>
<Script type = "text/javascript" src = "jquery-1.7.2.min.js"> </script>
<Script type = "text/javascript">
JQuery (document). ready (function (){
$. Ajax ({
Type: "GET",
Async: false,
// Url: "http: // test/jsonp. php",
Url: "",
DataType: "jsonp",
Jsonp: "callback", // The parameter name passed to the request handler or page to obtain the jsonp callback function name (usually the default value is callback)
JsonpCallback: "flightHandler", // custom jsonp callback function name. The default value is the random function name automatically generated by jQuery. You can also write "? ", JQuery will automatically process the data for you
Success: function (json ){
Alert ('You found the flight information: fare: '+ json. price +' yuan, remaining ticket: '+ json. tickets +. Callback function name: '+ json. func );
Error: function (){
Alert ("fail");

Note: to truly run the above code, you may need jquery files.

The code is as follows: Copy code
<Script type = "text/javascript" src = "jquery-1.7.2.min.js"> </script>

Change the file path of jquery in your Directory:
For example:

The code is as follows: Copy code
<Script type = "text/javascript" src = "js/jquery. js"> </script>

Then, you can find a web directory for another domain name, and set the file jsonp. php:

The code is as follows:

The code is as follows: Copy code
<? Php
$ Callback = $ _ GET ["callback"];
$ A = array (
'Code' => '000098 ',
'Price' => '123 ',
'Tickets '=> 20,
'Function' => $ callback,
$ Result = json_encode ($ );
Echo "flightHandler ($ result)";

Put it under this directory. In this way, you can test it.
You can see the effect directly on the browser testjsonp.html.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.