我有三个选择框.

<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和大多数其他浏览器中发生的事情是,它的大小发生了变化,将第3个推开了.但是在IE(6.0和7)中,第二个更改了大小,但没有将第三个更改.

我所做的是固定盒子的尺寸,但是我想正确地固定它,所以有人知道吗？

这是我用来将数据添加到所选部门的JQuery代码.

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

数据包含所需的< option> Stuff< / option>

编辑添加：选择框始终在其中具有某些值.

这是发生的情况的图片(我必须通过photoshop删除包装盒中的物品,但我明白了)

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

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);

}

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