1

jQuerymobileでGeonamesWSへのJSONP呼び出しでオートコンプリート関数を使用する方法についての例やチュートリアルはありますか?

ターゲットはhttp://jqueryui.com/demos/autocomplete/#remote-jsonpのようなものである必要がありますが、ドロップダウンメニューの代わりに、フォーマットされたリスト(クリック可能)を取得したいと思います。

その例http://www.raymondcamden.com/index.cfm/2012/3/27/Example-of-Autocomplete-in-jQuery-Mobileを見つけましたが、Geonamesを使用していないため、自分。

4

1 に答える 1

0

ここで私が使用したコード...あなたはあなた自身のコードでhrefタグだけを追加する必要があります:

        $( document ).on( "pageinit", "#myPage", function() {
        $( "#autocomplete" ).on( "listviewbeforefilter", function ( e, data ) {
            var $ul = $( this ),
                $input = $( data.input ),
                value = $input.val(),
                html = "";
            $ul.html( "" );
            if ( value && value.length > 2 ) {
                $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
                $ul.listview( "refresh" );
                $.ajax({
                    url: "http://ws.geonames.org/searchJSON",
                    dataType: "jsonp",
                    crossDomain: true,
                    data: {
                        featureClass: "P",
                        style: "full",
                        maxRows: 12,
                        lang: "it",
                        name_startsWith: $input.val()
                    }
                })
                .then( function ( response ) {
                    $.each( response.geonames, function ( i, val ) {
                        html += "<li>" + val.name + (val.adminName1 ? ", " + val.adminName1 : "") + ", " + val.countryName + "</li>";
                    });
                    $ul.html( html );
                    $ul.listview( "refresh" );
                    $ul.trigger( "updatelayout");
                });
            }
        });
    });
于 2013-07-13T10:42:30.470 に答える