Question

我有两个下拉菜单。在一个下拉列表中选择值时，XML文件中的相应值应该在dropdown2中。相应的值在dropdown2中完美地出现，但是每次我在下拉列表中选择值时它的宽度都会减小。我没有得到真正的问题所在。这个你能帮我吗。脚本代码：

var XML_PATH = "web/jsp/test.xml";
$(function getDropThreeDetails() {
$('#ddl3').empty();
$.ajax({
        type: "GET",
        url: XML_PATH,
        dataType: "xml",
        success: function(xml)
        {
            var selectedVal = $('#ddl2').val();
            $(xml).find(selectedVal).find('values').each(function(i)  {
                var ou2 = $(this).text();
                $('#ddl3').append("<option id='"+ ou2 +"'>"+ou2+"</option>");
            });

    }
  });
});

HTML代码：

    <td class="text1" align="left" colSpan="1"><b><font
        color="#5B5B5B" face="Arial">Service Request Category</font></b></td>
    <td><select id="ddl2"
        onchange="getDropThreeDetails(this,'ddl3')" style="width: 100%"
        Class="textbox">
    </select></td>
</tr>

<tr>
    <td class="text1" align="left" colSpan="1"><b><font
        color="#5B5B5B" face="Arial">Service Request Type</font></b></td>
    <td><select id="ddl3" style="width: 100%" Class="textbox">
    </select></td>
</tr>

XML文件代码：

<Statements>
    <values>Request for Final Interest certificate</values>
    <values>Request for Provisional Interest certificate</values>
    <values>Request for Amortization/Repayment Schedule for ROI/Balance tnure and o/s loan amt</values>
    <values>Statement of account</values>
    <values>Query on Statement/Certificates/Amortization chart</values>
</Statements>

<Disbursement>  
    <values>Part Payment Enquiry</values>
    <values>Part Payment Request</values>
    <values>Query on Part Payment request made</values>
    <values>Part Payment not Adjusted Properly</values> 
</Disbursement>

Answer 1

您可以将选择框设置为固定宽度。像这样：

<select id="ddl3" style="width: 200px">

但使用CSS更好。

select.big {
    width: 200px;
}
<select id="ddl3" class="big">

为什么每次选择都会自动降低下拉宽度？

1 个答案: