jQuery填充使用Ajax的選擇列表導致寬度發生變化

我有一個真正奇怪的問題。我有一個具有一定寬度的下拉列表。我使用Ajax調用填充下拉列表，並在填充下拉列表時縮小寬度。出於某種原因，當填充選項時，下拉列表的大小會發生變化（下拉列表的大小會縮小）。jQuery填充使用Ajax的選擇列表導致寬度發生變化

的JavaScript：

var serialNumberDropDownList = $("<select></select>"); 
    serialNumberDropDownList.attr("id","SerialNumberDropDownList_" + index); 

    serialNumberDropDownList.addClass("DropDownListStyle"); 

    serialNumberDropDownList.append($("<option></option>").attr("value", "").text("Please select Serial Number")); 


serialNumberDropDownList.click(function() { 

     if ($(this).children().length > 1) return false;   

     populateSerialNumberDropDownList();   

    }); 


function populateSerialNumberDropDownList() { 


    $.ajax(
      { 
       type: "POST", 
       url: "../SomeWebService", 
       dataType: "json", 
       data:"{}" , 
       contentType: "application/json", 
       success: function(response) { 

        var data = JSON.parse(response.d); 

        for (i = 0; i < data.length; i++) { 

         serialNumberDropDownList.append($("<option></option>").text(data[i]).val(data[i])); 
        } 

       }, 
       error: function(xhr) { 
        var res = eval("(" + xhr.responseText + ")"); 
        alert(res.Message); 
       } 
      }); 


} 

**CSS:** 

.DropDownListStyle 
{ 
    font-family:Verdana; 
    font-size:10px; 
    width:95%; 
    min-width: 95%; 
}

來源

2012-03-01 azamsharp

很高興在這裏見到你:)寬度：95％是一定的寬度？ – naveen 2012-03-01 19:34:09

是的，寬度95％是實際寬度！我不確定我是否理解評論。 – azamsharp 2012-03-01 19:39:53

當你將寬度設置爲200px而不是百分比時，你是否有這種相同的行爲？ – naveen 2012-03-01 20:02:06

古怪不夠的，如果我這樣做，然後它運行完美，它確實改變了下拉列表的寬度都：

complete: function() { 

       serialNumberDropDownList.removeClass("DropDownListStyle"); 
       serialNumberDropDownList.addClass("DropDownListStyle"); 

       }

來源

2012-03-01 19:25:46 azamsharp

jQuery填充使用Ajax的選擇列表導致寬度發生變化

回答

相關問題