Question

我有一个动态填充Ajax调用的选择框。用户在文本框中输入邮政编码，然后选择框中填充了该邮政编码中的城市。我的问题是selectbox开始为空但正确居中。一旦从Ajax响应中动态填充，IE就会将选择框向右扩展，并且不会根据新的宽度重新定位它。 Firefox和Chrome工作正常。我正在使用IE7进行测试。这是代码......

    <table width="400" cellspacing="0" cellpadding="2" border="0">
 <tr>
  <td align="center" colspan="2" class="greyheader">Location
  Information</td>
 </tr>
 <tr>
  <td colspan="2" align="center" class="grey"><span class="pagetitle1">&gt;&nbsp;</span>Please
  use only United States, Puerto Rico or Canada zip codes</td>
 </tr>
 <tr bgcolor="#E1E1E1">
  <td width="200" align="center"><b><u>Origin Zip Code</u></b></td>
  <td width="200" align="center"><b><u>Destination Zip Code</u></b></td>
 </tr>
 <tr bgcolor="#E1E1E1">
  <td width="200" align="center">
   <div id="czipS" class="shipperSpecific">
       &nbsp; 
   </div>
   <div class="consigneeSpecific">
   <center>
   <input size="7" type="text" autocomplete="off" maxlength="7"
    name="originZip" id="originZip" onkeypress="return handleEnter(this,event);"/>
   </center>
   </div>
  </td>
  <td  width="200" align="center">
   <div id="czipC" class="consigneeSpecific">
    &nbsp;
   </div>
   <div class="shipperSpecific">
   <center>
   <input size="7" type="text" autocomplete="off" maxlength="7"
    name="destZip" id="destZip" onkeypress="return handleEnter(this,event);" /> 
   </center>
   </div>
  </td>
 </tr>
 <tr bgcolor="#E1E1E1"> 
  <td  width="200" align="center">
   <div class="consigneeSpecific">
   <select id="originCity" name="originCity" />
   </div>
  </td> 
  <td  width="200" align="center">
   <div class="shipperSpecific">
   <select name="destCity" id="destCity" />
   </div>
  </td>
 </tr>
</table>

Answer 1

如果我看过ajax代码和插入，我可以帮助更好。

尝试在插入完成后将居中对齐类重新设置为选择框。通常，这会触发IE再次计算内容。

像这样（jquery）：

$('#destCity').removeClass('alignCenter').addClass('alignCenter');

动态选择框未在IE7中正确居中

1 个答案: