jQuery SelectedItem人口

我有一個下拉框，基於另一個下拉列表的值使用jQuery的ajaxy善良來填充自己。我這樣做與$（document）.ready函數，這個是相關的代碼...jQuery SelectedItem人口

$(document).ready(function() { 
    populateFirstDropDownBox(); 

    $("#firstBox").change(function() { 
    populateSecondDropDownBox($("#firstBox option:selected").val()); 
    }); 

    // Do this on initial page load to populate second box 
    populateSecondDropDownBox($("#firstBox option:selected").val()); 
});

這在Firefox和IE的偉大工程，但不能在Chrome中。 Chrome似乎沒有立即填充第一個下拉框，因此$（「＃firstBox option：selected」）。val（）最終不能解析。

確保Chrome已經填充下拉列表的最佳方式是什麼？

編輯：增加了更多的

function populateFirstDropDownBox() { 
    $.post("ajax/getFirstBox", function(json) { 
    var options = makeOptionList(json); 
$("#firstBox").html(options); 
$("#firstBox").triggerHandler("change"); 
    }) 
} 

function populateSecondDropDownBox(firstBox) { 

    $.post("ajax/getSecondBox", {firstBox: firstBox}, function(json) { 
    var options = makeOptionList(json); 
$("#secondBox").html(locationOptions); 
$("#secondBox").triggerHandler("change"); 
    }) 
} 

function makeOptionList(json) { 
    data = eval(json); 
    var options = ""; 

    for (var optIndex = 0; optIndex < data.length; ++optIndex) { 
    options += "<option value='" + data[optIndex].value + "'>" + data[optIndex].key + "</option>" 
    } 

    return options; 
}

來源

2010-02-25 majorpayne27

刪除此：

// Do this on initial page load to populate second box 
populateSecondDropDownBox($("#firstBox option:selected").val());

因爲這個代碼：

$("#firstBox").triggerHandler("change")

將觸發一次的第一個下拉列表加載。

更棒的是，在服務器上的HTML中填充下拉菜單並保存兩次往返。您的用戶會很感激。

來源

2010-02-25 20:34:03 noah

是的，但我仍然有我最初的問題，（「#firstBox選項：選擇」）不會立即在Chrome中填充。像IE和Firefox中的魅力一樣工作。但是，在Chrome中，由於該值尚未設置，因此populateSecondDropDownBox失敗。我想我只是在尋找一種方法來強制Chrome來填充第一個Box元素。 – majorpayne27 2010-02-25 20:47:19

您正在發出異步請求來加載數據。 Firefox和IE可以加載速度足夠快，看起來很直接，但事實並非如此。當用戶嘗試加載頁面時，他們與服務器之間的延遲時間較長，並且在任何瀏覽器中都會遇到同樣的問題。您構建代碼的方式必須對Ajax響應處理程序中的第二個盒子進行全部處理，以使其始終如一地工作。 – noah 2010-02-25 21:13:08

jQuery SelectedItem人口

回答

相關問題