我正在使用 jquery 根据选择框选项隐藏和显示一些 div。当我更改选择框的值时，应该发生的操作会发生，但显示的 div 位于下一个 div 的下方（div 的 ant 被“推”下）。
这是jQuery代码：
<script type='text/javascript'>
$(document).ready(function(){
$('#alldates').hide();
$('#dateselect').hide();
$('#dateselectchoices').change(function(){
$('#' + this.value).show().siblings().hide();
});
$('#dateselectchoices').change();
});
$(document).ready(function(){
$('#nocountyselect').hide();
$('#countyselect').hide();
$('#regionselect').hide();
$('#countyselectchoices').change(function(){
$('#' + this.value).show().siblings().hide();
});
$('#countyselectchoices').change();
});
</script>
以及随后的html：
<div class="tbl_container">
<span class="tbl_left">Registered Date Range:</span>
<span class="tbl_right"><select id='dateselectchoices' name='$rangename'><option value='alldates'>All Dates</option>
<option value='dateselect'>Specify Date Range</option>
</select>
<div id='boxes'>
<div id='alldates'></div>
<div id='dateselect'><span style='width:80px; display:inline-block;'>Start Date: </span><span style='display:inline-block;'>
<input type='text' class='input-medium' name='rangestart' id='rangestart' /> <a href='#' onClick=\"cal.select(document.getElementById('rangestart'),'startanchor','yyyy-MM-dd'); return false;\" name='startanchor' id='startanchor'>
<img src='http://www.ampltek.net/marn/calendar.jpg' border='0' /></a></span><br/>
<span style='width:80px; display:inline-block;'>End Date: </span><span style='display:inline-block;'>
<input type='text' class='input-medium' name='rangeend' id='rangeend' /> <a href='#' onClick=\"cal.select(document.getElementById('rangeend'),'endanchor','yyyy-MM-dd'); return false;\" name='endanchor' id='endanchor'>
<img src='http://www.ampltek.net/marn/calendar.jpg' border='0' /></a></span></div>
</div>
</span>
</div>
<div class="tbl_container">
<span class="tbl_left">County/Region:</span>
<span class="tbl_right"><select id='countyselectchoices' name='countyselectchoices'>
<option value='nocountyselect' selected='selected'>Any</option>
<option value='countyselect'>County</option>
<option value='regionselect'>Region</option>
</select>
<div id='boxes2' style='display:inline-block; -moz-inline-stack; zoom: 1; *display: inline;'>
<div id='nocountyselect'></div><div id='countyselect'><?php countySelect(countychoice); ?></div><div id='regionselect'><?php regionSelect(regionchoice); ?></div>
</div></span>
</div>
这些选择框中的第二个不会创建选项，因为它显示的框与它一起显示。有什么想法吗？在 Firefox 3/Chrome 中一切正常...