2

当我的应用程序首次打开时,我正在通过 ajax 调用动态填充几个选择框。然而,当页面加载时,我注意到我的选择框一开始是空的,然后一旦填充它们就会相应地调整它们的大小。这很烦人,而且有点让人分心。

我的 document.ready 方法中确实有填充方法,但也许我处理不正确?

$(document).ready( function(){

populateOptions(); // Populate our select box upon page load.

});

// Builds a select list and binds it to a class
function populateOptions(){

    var optionList = getOptions();
    var myList = "";

    // Loop over our returned result set and build our options
   for(i=0; optionList.length; i++){
       myList += "<option>"+optionList[i][1]+"</option>";
    }

    // Now take our myList and append it to our select
    $("#myOptionList").append(myList);
}

Options: <select id="myOptionList"></select>
4

3 回答 3

2

您可以通过css为选择设置宽度

于 2012-07-22T00:25:37.867 回答
1

添加一个虚拟选项以在通过 AJAX 加载时显示:

<select id="myOptionList">
    <option>Loading...</option>
</select>

清除“加载”选项并在可用时添加新列表

$("#myOptionList").html('');
$("#myOptionList").append(myList);

用css设置宽度:

#myOptionList{
width:150px;
}
于 2012-07-22T00:09:17.300 回答
0

一种简单的解决方案是在调用 ajax 函数时直接创建您的孩子。

在完成您的 populateOptions() 函数之前,将选择附加到您的 .

我记得有这个问题,可以解决它,但这是一种非常简单的处理方法。

希望这有帮助。

于 2012-07-22T00:07:02.343 回答