jQuery移動Openlayer搜索

Question

大家好，我對jquery移動openlayer搜索有問題；

$('#searchpage').live('pageshow',function(event, ui){
$('#query').bind('change', function(e){
    $('#search_results').empty();
    if ($('#query')[0].value === '') {
        return;
    }
    $.mobile.showPageLoadingMsg();

    // Prevent form send
    e.preventDefault();

    var searchUrl = 'http://ws.geonames.org/searchJSON?featureClass=P&maxRows=10';
    searchUrl += '&name_startsWith=' + $('#query')[0].value;
    $.getJSON(searchUrl, function(data) {
        $.each(data.geonames, function() {
            var place = this;
            $('<li>')
                .hide()
                .append($('<h2 />', {
                    text: place.name
                }))
                .append($('<p />', {
                    html: '<b>' + place.countryName + '</b> ' + place.fcodeName
                }))
                .appendTo('#search_results')
                .click(function() {
                    $.mobile.changePage('#mappage');
                    var lonlat = new OpenLayers.LonLat(place.lng, place.lat);
                    map.setCenter(lonlat.transform(gg, sm), 10);
                })
                .show();
        });
        $('#search_results').listview('refresh');
        $.mobile.hidePageLoadingMsg();
    });
});

// only listen to the first event triggered
$('#searchpage').die('pageshow', arguments.callee);
});

`

我的問題是，我有json文件，但我不知道如何使用json文件更改搜索網址。我在這里需要一些幫助。

非常感謝

Answer 1

因為您並未真正聲明，所以我假設在獲取搜索結果的同時，您還想用另一個JSON文件返回的searchUrl更新您的searchUrl，您將在下一個搜索中使用它。

在這種情況下，最簡單的方法是在整體上將searchUrl提升為全局變量，並包括一種對其進行更新的方法，而無需對當前代碼進行大量改動。

var jsonUrl = {
    param: 'http://ws.geonames.org/searchJSON?featureClass=P&maxRows=10',
    update: function (url) {
        this.param = url;
    }
};

更改此：

var searchUrl = 'http://ws.geonames.org/searchJSON?featureClass=P&maxRows=10';
searchUrl += '&name_startsWith=' + $('#query')[0].value;

對此：

var searchUrl = jsonUrl.param + '&name_startsWith=' + $('#query')[0].value;

假設您的新json網址包含在（your_json_object）.url中，請在$ .getJSON閉包之前添加一行：

jsonURL.update(data.url);

您的最終代碼應如下所示：

var jsonUrl = {
    param: 'http://ws.geonames.org/searchJSON?featureClass=P&maxRows=10',
    update: function (url) {
        this.param = url;
    }
};

$('#searchpage').live('pageshow',function(event, ui){
$('#query').bind('change', function(e){
$('#search_results').empty();
if ($('#query')[0].value === '') {
    return;
}
$.mobile.showPageLoadingMsg();

// Prevent form send
e.preventDefault();

var searchUrl = jsonUrl.param + '&name_startsWith=' + $('#query')[0].value;
$.getJSON(searchUrl, function(data) {
    $.each(data.geonames, function() {
        var place = this;
        $('<li>')
            .hide()
            .append($('<h2 />', {
                text: place.name
            }))
            .append($('<p />', {
                html: '<b>' + place.countryName + '</b> ' + place.fcodeName
            }))
            .appendTo('#search_results')
            .click(function() {
                $.mobile.changePage('#mappage');
                var lonlat = new OpenLayers.LonLat(place.lng, place.lat);
                map.setCenter(lonlat.transform(gg, sm), 10);
            })
            .show();
    });
    $('#search_results').listview('refresh');
    $.mobile.hidePageLoadingMsg();
});
});

// only listen to the first event triggered
$('#searchpage').die('pageshow', arguments.callee);

//add this to update new URL retrieved into your jsonUrl object.
jsonURL.update(data.url);
});