[英]how to check and receive result for the api call over jquery ajax
我正在尝试使用带有 post 方法的 URL 和参数通过 jquery ajax 命中 API。 在这里,我正在检查某个 e-com 网站的给定 Pincode 是否可以交付,请帮助我了解如何从 API 响应中检查或接收数据。
我的脚本:
<script type="text/javascript">
$(document).ready(function () {
$('#check').click(function(){
var api_url = 'http://example.com/webservices/b2cpincodecheck.jsp';
var key = '4A8DA5E635656';
var pincode = 604408 ;
if(pincode=="") {
alert("please enter the pincode");
} else {
$.ajax({
url:api_url+"?reqid="+key+"&pincode="+pincode,
dataType: "text/json",
type: "POST",
success: function(result){
//console.log(result);
if(result) {
alert("Delivery is available!");
} else {
alert("Delivery is not available!");
}
}
})
}
});
});
</script>
根据给定文档中的 API 响应,我将获得 XML 格式的数据
他们的回应:
<response>
<result>successful</result>
<pinCode>604408</pinCode>
<ouCode>abc</ouCode>
</response>
请帮助我了解如何从 API 响应中检查或接收数据。 提前致谢。
jQuery AJAX
方法是通过调用 API 从外部网站加载数据,并获得JSON
或XML
格式的响应。 这个例子向你展示了在jQuery AJAX
进行这样的 API 调用是多么容易。像这样
$(document).ready(function () {
$("#submit").click(function (e) {
var validate = Validate();
$("#message").html(validate);
if (validate.length == 0) {
$.ajax({
type: "POST",
url: "http://api.openweathermap.org/data/2.5/weather?id=" + $("#citySelect").val() + "&appid=API-KEY&units=metric",
dataType: "json",
success: function (result, status, xhr) {
var table = $("<p>Weather Description</p>");
table.append("<p>City:</p>" + result["name"] + "</p>");
table.append("<p>Country:</p>" + result["sys"]["country"] + "</p>");
table.append("<p>Current Temperature:</p>" + result["main"]["temp"] + "°C</p>");
table.append("<p>Humidity:</p>" + result["main"]["humidity"] + "</p>");
table.append("<tr><td>Weather:</p>" + result["weather"][0]["description"] + "</p>");
$("#message").html(p);
},
error: function (xhr, status, error) {
alert("Result: " + status + " " + error + " " + xhr.status + " " + xhr.statusText)
}
});
}
});
获取结果<div id="message"></div>
$(document).ready(function () { $('#check').click(function(){ var api_url = 'http://example.com/webservices/b2cpincodecheck.jsp'; var key = '4A8DA5E635656'; var pincode = 604408 ; if(pincode=="") { alert("please enter the pincode"); } else { $.ajax({ url:api_url+"?reqid="+key+"&pincode="+pincode, dataType: "xml", type: "POST", success: function(result, status, jqXHR){ console.log(loadData(result || jqXHR.responseText)) } }) } }); }); function loadData(xml) { var incubator; if (typeof xml === "string") { incubator = document.createElement("div"); incubator.innerHTML = xml; } else { incubator = xml; } return { "response": { "result": incubator.querySelector("result").textContent, "pinCode": incubator.querySelector("pinCode").textContent, "ouCode": incubator.querySelector("ouCode").textContent, } } } function xmlToObject(xml) { var incubator = document.createElement("div"); incubator.innerHTML = xml; return Array.prototype.map.call(incubator.childNodes, nodeToObject) } function nodeToObject(node) { if (node.nodeType === Node.ELEMENT_NODE) { return { nodeName: node.nodeName.toLowerCase(), attributes: nodeAttributesToObject(node), childNodes: Array.prototype.map.call(node.childNodes, nodeToObject) }; } if (node.nodeType === Node.TEXT_NODE) { return node.textContent; } } function nodeAttributesToObject(node) { var result = {}; Array.prototype.forEach.call(node.attributes, function (attr) { result[attr.name] = attr.value; }); return result; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
这是从 xml 中提取数据的两个示例:
loadData
得到你期望的字段xmlToObject
可以帮助您将 XML 视为一个简单的 JavaScript 对象。 请注意: jQuery ajax 设置dataType
应为空或直接格式(即: "json"
,而不是"text/json"
),此处应将其设置为"xml"
。
希望它会帮助你!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.