根據 JSON 數據選擇下拉值

Question

我正在嘗試構建一個簡單的 jquery 插件，該插件查詢地理定位系統並返回有關用戶 IP 所在位置的數據，並以 HTML 形式預選它。

我有一個 HTML select ，其中所有國家代碼都作為值。 我需要 select 返回數據中引用的那個。 這是我目前所擁有的......

(function($){

    $.fn.geoselect = function() {

        $.getJSON('http://www.geoplugin.net/json.gp?jsoncallback=?', function(data) {
            this.attr("selected", "selected");
        });

    };

})(jQuery);

顯然，目前這不會作為與 select 整體相關的“此”工作，而不是其選項之一。 例如，如果返回的數據是“GB”，我需要 select 值為“GB”的選項。

Answer 1

而不是this.attr("selected", "selected"); 做這個：

var selectedData = 'GB' // assuming you extracted it from JSON data already

$("option[value='" + selectedData + "']", $(this)).attr("selected", "selected"); // Assuming that "this" is a reference to your picklist.

Answer 2

你在$.getJSON里面，所以this不是指你的 select。 相反，將其保存到父 scope 中的變量中，然后在回調中訪問它。 然后，您可以使用.find()方法獲取特定的<option>標記。

我還將假設您從 API 獲取的數據是data['geoplugin_city']

$.fn.geoselect = function() {
    var dropdown = this;

    $.getJSON('http://www.geoplugin.net/json.gp?jsoncallback=?', function(data) {
        $(dropdown).find('option[value="' + data['geoplugin_city'] + '"]').attr("selected", "selected");
    });
};