0

私はこれについて多くのことを研究しましたが、魔法を見つけることができませんでした. 実際には、都市の暗証番号のリストを作成したいと考えています。JQuery オートコンプリート UI を使用します。httpsページです。Firefox では動作しますが、Google Chrome では動作しません。誰でもこの問題を解決するのを手伝ってくれますか? 前もって感謝します。

以下は私のコードです：

function zipAutoCompletet(prefix) {
    jQuery("#" + prefix + "_zip").autocomplete({
        source: function(request, response) {
            jQuery.ajax({
                url: "http://ws.geonames.org/postalCodeSearchJSON",
                dataType: "jsonp",
                data: {
                    style: "full",
                    maxRows: 12,
                    postalcode_startsWith: request.term
                },
                success: function(data) {
                    response(
                        jQuery.map(data.postalCodes, function(item) {
                            return {
                                label:
                                    item.placeName +
                                    (item.adminCode1
                                        ? ", " + item.adminCode1
                                        : "") +
                                    ", " +
                                    item.postalCode +
                                    ", " +
                                    item.countryCode,
                                value: item.postalCode
                            };
                        })
                    );
                    jQuery(".ui-autocomplete").css("width", "188px");
                }
            });
        },
        minLength: 2,
        select: function(event, ui) {
            var myString = new String(ui.item.label);
            var address = myString.split(",");

            jQuery("#" + prefix + "_city").val(address[0]);
            jQuery("#" + prefix + "_city").addClass("activated");
            jQuery("#" + prefix + "_city").trigger("change");
            jQuery("#" + prefix + "_city")
                .parents(".row")
                .removeClass("error-row");
            jQuery("#" + prefix + "_city")
                .parents(".row")
                .addClass("ok-row");

            var countryCode = address[3] ? address[3] : address[2];
            countryCode = jQuery.trim(countryCode);
            var countryName = jQuery(
                "#" +
                    prefix +
                    '_country option[value="' +
                    jQuery.trim(countryCode) +
                    '"]'
            ).text();
            jQuery("#countryContainer .jqTransformSelectWrapper span").html(
                countryName
            );
            jQuery("#countryContainer .jqTransformSelectWrapper").addClass(
                "selected-jqtranform"
            );
            jQuery("#" + prefix + "_country")
                .parents(".row")
                .addClass("ok-row");
            jQuery("#" + prefix + "_country")
                .parents(".row")
                .removeClass("error-row");
            jQuery("#" + prefix + "_country").val(jQuery.trim(countryCode));

            var stateCode = address[2] ? address[1] : "";
            stateCode = jQuery.trim(stateCode);

            if (countryCode == "US") {
                var base = base_url;
                base = base.replace("https", "http");

                jQuery.ajax({
                    url: base + "/getStateName",
                    dataType: "jsonp",
                    data: { stateCode: stateCode },
                    success: function(data) {
                        stateName = data;

                        jQuery("#jc_state").val(stateName);
                        jQuery("#jc_state").addClass("activated");
                        jQuery("#jc_state")
                            .parents(".row")
                            .removeClass("error-row");
                        jQuery("#jc_state")
                            .parents(".row")
                            .addClass("ok-row");
                        jQuery("#jc_state").trigger("change");
                        formValidate();
                    }
                });
            } else {
                stateName = stateCode;

                jQuery("#jc_state").val(stateName);
                jQuery("#jc_state").addClass("activated");
                jQuery("#jc_state")
                    .parents(".row")
                    .removeClass("error-row");
                jQuery("#jc_state")
                    .parents(".row")
                    .addClass("ok-row");
                jQuery("#jc_state").trigger("change");
                formValidate();
            }

            jQuery("#" + prefix + "_zip")
                .parents(".row")
                .addClass("ok-row");
            jQuery("#" + prefix + "_zip")
                .parents(".row")
                .removeClass("error-row");
        },
        open: function() {
            jQuery(this)
                .removeClass("ui-corner-all")
                .addClass("ui-corner-top");
        },
        close: function() {
            jQuery(this)
                .removeClass("ui-corner-top")
                .addClass("ui-corner-all");
        },
        change: function(event, ui) {
            if (ui.item === null) {
                jQuery("#" + prefix + "_zip")
                    .parents(".row")
                    .removeClass("ok-row");
                jQuery("#" + prefix + "_zip")
                    .parents(".row")
                    .addClass("error-row");
                $("#" + prefix + "_zip").val("");
            }
        }
    });
}
4

1 に答える 1

2

https ページを使用している場合、ブラウザは安全でないリソース (http) へのリクエストをブロックします。定期的に、それに関する通知が表示されるはずです。他のブラウザは、デフォルトで保護されたページで保護されていない AJAX リクエストをブロックしないように見えますが、Google Chrome はブロックします。

あなたのコードでは、ハードコーディングされた URL があります:

url: "http://ws.geonames.org/postalCodeSearchJSON",

それがクロス ドメイン リクエストであり、HTTPS をサポートしている場合は、次のように変更できます。

url: "//ws.geonames.org/postalCodeSearchJSON",

ご覧のとおり、プロトコルはそこで指定されていません。ブラウザはページのデフォルト プロトコル (http または https) を取得し、それを使用してデータを要求します。

于 2013-01-30T15:44:21.270 に答える