0
这是一个让我们有点疯狂的东西。我们从jQuery UI页面http://jqueryui.com/autocomplete/#remote-jsonp中实现了JSONP的示例脚本，然后放在它旁边，我们编写了一个最小修改版本。jQuery UI自动完成功能在IE JSON中不起作用
这里是踢球。从jQuery UI的脚本在IE和我们只在火狐，Chrome等
工作，唯一的区别就是我们的数据源。
它有一些神奇的事情，我们需要的时候，我们将其发送给客户做我们的数据？我们尝试它包裹在一个名为功能等
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title></title>
<link rel="stylesheet" href="/css/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
</head>
<body>
<script>
function foo (str) {
//console.log(str);
return str;
}
$(function() {
function log(message) {
$("#street1").val(message);
}
$("#street1").autocomplete({
source: function(request, response) {
$.ajax({
url: "http://192.168.50.78/melissa/address/linux/interfaces/php/api/autoAddrSuggest_new_dual2.php",
dataType: "json",
data: {
format: 'json',
action: 'address1request',
zipcode: '43026',
address: request.term
},
success: function(data) {
console.log(data.addresses);
response($.map(data.addresses, function(item) {
return {
label: item.address,
value: item.address
};
}));
},
error: function(data) {
console.log(data);
}
});
},
minLength: 2,
select: function(event, ui) {
log(ui.item ?
"Selected: " + ui.item.value :
"Nothing selected, input was " + this.value);
},
open: function() {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function() {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
$("#city").autocomplete({
source: function(request, response) {
$.ajax({
url: "http://ws.geonames.org/searchJSON",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function(data) {
console.log(data.geonames);
response($.map(data.geonames, function(item) {
return {
label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
value: item.name
};
}));
}
});
},
minLength: 2,
select: function(event, ui) {
log(ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function() {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function() {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
});
</script>
<div id="wrap">
<div id="main">
<div>
<form id="enroll" name="enroll" method="post" enctype="multipart/form-data">
<div>
<p class="left">
<span> </span><br/>
<input id="street1" />
<input id="city" />
</p>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
对于笑声，这里是从工作的JSON服务
{"totalResultsCount":12958,"geonames":[{"countryName":"Russia","adminCode1":"33","fclName":"city, village,...","countryCode":"RU","lng":51.4913,"fcodeName":"seat of a second-order administrative division","toponymName":"Uni","fcl":"P","name":"Uni","fcode":"PPLA2","geonameId":478996,"lat":57.751,"adminName1":"Kirov","population":4767},{"countryName":"Russia","adminCode1":"54","fclName":"city, village,...","countryCode":"RU","lng":72.622724,"fcodeName":"populated place","toponymName":"Uki","fcl":"P","name":"Uni","fcode":"PPL","geonameId":1488608,"lat":56.991135,"adminName1":"Omsk","population":0},{"countryName":"Philippines","adminCode1":"07","fclName":"city, village,...","countryCode":"PH","lng":124.3252,"fcodeName":"populated place","toponymName":"Union","fcl":"P","name":"Union","fcode":"PPL","geonameId":1680262,"lat":10.6695,"adminName1":"Central Visayas","population":4581},{"countryName":"Philippines","adminCode1":"13","fclName":"city, village,...","countryCode":"PH","lng":126.1102778,"fcodeName":"populated place","toponymName":"Union","fcl":"P","name":"Union","fcode":"PPL","geonameId":1680267,"lat":9.7566667,"adminName1":"Caraga","population":2368}]}
输出这里是从我们的服务器输出
{"addresses":[{"address":"3666 LACEY WOODS PARK"},{"address":"3666 LACON RD"},{"address":"3666 LAKESTONE CIR"},{"address":"3666 E LINKS CIR"}]}
您确实需要发回包含在回调函数中的响应。您需要阅读'callback'（或类似的）参数，并在对该函数的调用中包装响应。 –
你能提供一个例子吗？我们的API究竟应该如何回应客户？你的意思是来自api的响应应该是：“myfunctionname（... json ...）”而不仅仅是“json” –
好吧，也许我应该备份并说如果你提出请求，你不需要JSONP在页面被投放的同一个域中。是这样吗？其实它看起来不像你在代码中使用JSONP。你有没有在网页上发现任何错误？ –