<select> IE中的宽度不像其他浏览器那样运行

我有三个选择框。<select> IE中的宽度不像其他浏览器那样运行

<div style='float: left; padding-right: 10px;'> 
    <select size="10" name="company_id"> 
     // a lot of options here 
    </select> 
</div> 

<div style='float: left; padding-right: 10px;'> 
    <select size="10" name="department_id" id="department_id"> 
     // a lot of options here 
    </select> 
</div> 

<div style='float: left; padding-right: 10px;'> 
    <select size="10" name="user_id[]" id="user_id" multiple> 
     // a lot of options here 
    </select> 
</div>

它们彼此相邻。当您在第一个项目中选择一个项目时，ajax查询会更新第二个项目的值。

在Firefox和大多数其他浏览器中会发生什么，它发生了变化，并推动了第三个浏览器。但在IE（6.0和7）中，第二个更改大小，但不会将第三个更改。

我所做的是修复盒子的大小，但我想正确地解决这个问题，所以任何人都知道如何？

这里是我用来将数据添加到部门选择的JQuery代码。

$.get("ajax/fetchDepartment.php?sec=departments&company_id="+company_id, 
    function(data){ 
     $("#department_id").html(data); 
});

data包含<option>Stuff</option>的需要

编辑补充：选择框总是在其中一些价值。

这里是发生了什么（我不得不通过Photoshop来删除盒中的物品，但你明白我的意思）

selcet bug http://cznp.com/select_bug.jpg

来源

2009-03-06 Ólafur Waage

您可以显示的CSS的选择吗？ – 2009-03-06 12:42:02

选择本身没有CSS。我会添加它们周围的div标签。 – 2009-03-06 12:44:38

当动态添加选项时，IE确实有怪癖 - 你能发布如何将不同的选项值添加到选择框吗？ – Steerpike 2009-03-06 13:00:53

IE和select选项有一些'怪癖'（有些关于select框和innerHTML的细节here）关于它们我从来没有真正理解过，但我至少可以为你提供一种解决方法。诀窍是将选项明确地添加到选择框中，而不仅仅是更改select元素批量的整个html。所以下面的工作：

function changeval() { 

    var option = document.createElement("option"); 
    option.text = 'my long text value to change stuff'; 
    option.value = 'test'; 
    $('#department_id')[0].options.add(option); 
}

虽然这并不：

function changeval() { 
    var data = '<option value="test">my long test string with wide stuff</option>'; 
    $("#department_id").html(data); 

}

您可能会发现这page有用-apparently他仅通过润饰的innerHTML固定的，所以这可能是一个简单的选择。由你决定。

从第二个链接的解决办法是这样的：

function changeval() { 
    var data = '<option value="test">my long test string with wide stuff</option>'; 
    $("#department_id").html(data); 
    $("#department_id").parent()[0].innerHTML += ''; 
}

来源

2009-03-06 13:19:02 Steerpike

尝试把一个选项里面选择在启动画面。我想你只有在你从第一个选择某个东西的时候才开始填充第二个和第三个选择。

我已经受够了在IE空选择问题，所以只要把

<option value="-1">-</option>

在第二和第三选择开始。

来源

2009-03-06 12:39:02

回答

相关问题