我正在用Openlayers开发一张在线地图。在那张地图上,我有一个矢量图层,显示餐馆。每家餐厅都有一个图标,可以点击这个图标打开一个弹出窗口,以显示更多信息。到目前一切尚好。但是我想在Jquery中实现一个自动完成搜索。所以,我想要做的是,当您在自动完成中选择一个餐厅名称时,我希望地图打开相应的弹出框(触发弹出加上地图的中心并缩放)。我设法把地图居中,但我找不出弹出式打开的原因。
在这里,我使用的自动完成代码:
$(function() {
$( "#searchresto" ).catcomplete({
delay: 0,
source: "select_resto.php",
select: function ( event, ui )
{
map.setCenter(
new OpenLayers.LonLat( ui.item.h_lon, ui.item.h_lat).transform(
new OpenLayers.Projection(Geo_pjt),
map.getProjectionObject()
), 5 );
},
open: function () {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top");
},
close: function () {
$( this ).removeClass( "ui-corner-top").addClass("ui-corner-all");
}
});});这就是我的向量层:
var resto = new OpenLayers.Layer.Vector("GML", {
protocol: new OpenLayers.Protocol.HTTP({
url: "restaurant.php",
format: new OpenLayers.Format.GML(),
}),
strategies: [new OpenLayers.Strategy.Fixed()],
projection: map.displayProjection,
});有人知道如何在Jquery函数中调用弹出窗口吗?或者我想做的事是不可能的?
发布于 2014-04-08 15:21:30
经过数周的努力,我终于找到了一个答案。
如果您感兴趣,请参阅以下内容:
首先,在自动完成的输入中添加一个“onchange=”您的函数()“
<input type="text" id="searchresto" onchange="yourfunction(this)"/>然后在你的第一层:
function getFeatureByHid(featureHId) {
var feature = null;
var found = false;
for(var i=0, len=resto.features.length; i<len; ++i) {
if(resto.features[i].attributes.crID == featureHId) {
feature = resto.features[i];
found = true;
break;
}
}
return feature;
}
function SelectRestoByRestoId(crID)
{
var feature = getFeatureByHid(crID);
if (feature)
{
restoSelect.unselectAll();
restoSelect.select(feature);
}
return true;
}
function yourfunction(event,ui){
return SelectRestoByRestoId(ui.item.id);
}最后,只需在您的自动完成中调用您的函数
$(function() {
$( "#searchresto" ).catcomplete({
delay: 0,
source: "select_resto.php",
select: yourfunction
});});完了!无论如何,由于没有回答,我真的提高了我的Javascript技能!)我希望这会对某人有所帮助!
https://stackoverflow.com/questions/22632831
复制相似问题