隐藏表格的行后,表格变形了(help!~)<table cellspacing="1" id="ShippingTable" border='1'>
<colgroup>
<col style="width:100px" />
<col style="width:70px" />
<col style="width:90px" />
<col style="width:80px" />
</colgroup>
<tr id="ShippingAddressRow">
<td colspan="4">Shipping Address</td>
</tr>
<tr id="ShippingCompanyNameRow">
<th >Company : </th>
<td colspan="3" >
<!-- same problem -->
<input type="text" id="ShippingCompanyName" name="ShippingCompanyName" size="35" maxlength="50" onkeydown="onchengeAddress('Left');" value="" />
<span id="ShippingCompanyNameMessage" ></span>
</td>
</tr>
<tr id="ShippingNameRow">
<th >First name : </th>
<td >
<input type="text" id="ShippingFirstName" name="ShippingFirstName" size="10" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
<th >Last name : </th>
<td >
<input type="text" id="ShippingLastName" name="ShippingLastName" size="7" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingTelRow">
<th >Telephone : </th>
<td colspan="3">
<input type="text" id="ShippingTel" name="ShippingTel" size="35" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingAddressRows">
<th >Address : </th>
<td colspan="3">
<input type="text" id="ShippingAddress" name="ShippingAddress" size="35" maxlength="100" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingAddress2Rows">
<th ></th>
<td colspan="3">
<input type="text" id="ShippingAddress2" name="ShippingAddress2" size="35" maxlength="100" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingStatesRow">
<th >City:</th>
<td >
<input type="text" name="ShippingCity" id="ShippingCity" size="17" maxlength="25" value="" onkeydown="onchengeAddress('Left');isAddress()"/><span id="ShippingCityMessage" ></span>
</td>
<td colspan="2">State:<select onchange="isAddress();onchengeAddress('Left');" name="ShippingStateSn" id="ShippingStateSn"><option selected value="0">Select...</option><option value="12">Alabama</option><option value="14">Alaska</option><option value="16">Arizona</option><option value="18">Arkansas</option><option value="8">California</option><option value="20">Colorado</option><option value="22">Connecticut</option><option value="24">Delaware</option><option value="26">Florida</option><option value="28">Georgia</option><option value="30">Hawaii</option><option value="32">Idaho</option><option value="34">Illinois</option><option value="36">Indiana</option><option value="38">Iowa</option><option value="40">Kansas</option><option value="42">Kentucky</option><option value="44">Lousiana</option><option value="46">Maine</option><option value="48">Maryland</option><option value="50">Massachusetts</option><option value="6">Miami</option><option value="52">Michigan</option><option value="54">Minnesota</option><option value="56">Mississippi</option><option value="58">Missouri</option><option value="60">Montana</option><option value="62">Nebraska</option><option value="64">Nevada</option><option value="66">New Hampshire</option><option value="68">New Jersey</option><option value="70">New Mexico</option><option value="5">New York</option><option value="72">North Carolina</option><option value="74">North Dakota</option><option value="3">Ohio</option><option value="76">Oklahoma</option><option value="78">Oregon</option><option value="80">Pennsylvania</option><option value="82">Rhode Island</option><option value="84">South Carolina</option><option value="86">South Dakota</option><option value="88">Tennessee</option><option value="90">Texas</option><option value="92">Utah</option><option value="94">Vermont</option><option value="96">Virginia</option><option value="98">Washington</option><option value="100">West Virginia</option><option value="102">Wisconsin</option><option value="104">Wyoming</option></select>
</td>
</tr>
<tr id="ShippingCountryRow">
<th >Zip Code:</th>
<td>
<input type="text" name="ShippingZipCode" id="ShippingZipCode" onkeyup="copyZip(0)" maxlength="8" maxlength="7" size="8" value="" onkeydown="onchengeAddress('Left');isAddress()" />
</td>
<td colspan="2">Country:<select onchange="switchStates(this.value, 'ShippingStateSn'); isAddress();onchengeAddress('Left');copyCountry(0);" name="ShippingCountrySn" id="ShippingCountrySn"><option value="0">Select...</option><option value="7">Canada</option><option selected value="4">USA</option></select>
<span id="ShippingCountryMessage" ></span>
</td>
</tr>
<tr id="ShippingMessageRow">
<td></td>
<td colspan="3" >
<span id="ShippingMessage" name="ShippingMessage" ></span>
</td>
</tr>
<tr >
<td colspan="2" id="UnimportantInfo" >
<a href="#" id="UnimportantInfoAhref" onclick="showUnimportantInfo()"> [ UnimportantInfoAhref ] </a>
</td>
<td colspan="2" id="DuplicateRightRow" >
<a href="#" id="DuplicateRightAhref" > [ Duplicate Right ] </a>
</td>
</tr></table><script>var b_flag = 0;
function $(id) {
return document.getElementById(id);
}
function showUnimportantInfo() {
if(b_flag) {
$('ShippingCompanyNameRow').style.display = '';
$('ShippingNameRow').style.display = '';
$('ShippingTelRow').style.display = '';
//$('BillingCompanyNameRow').style.display = '';
//$('BillingNameRow').style.display = '';
//$('BillingTelRow').style.display = '';
b_flag = 0;
} else {
$('ShippingCompanyNameRow').style.display = 'none';
$('ShippingNameRow').style.display = 'none';
$('ShippingTelRow').style.display = 'none';
b_flag = 1;
}
}
</script>我点击[ UnimportantInfoAhref ]隐藏ShippingCompanyNameRow, ShippingNameRow, ShippingTelRow
后表格被拉大了
再点击后显示,我想知道什么原因把这个表格给拉大了
<colgroup>
<col style="width:100px" />
<col style="width:70px" />
<col style="width:90px" />
<col style="width:80px" />
</colgroup>
<tr id="ShippingAddressRow">
<td colspan="4">Shipping Address</td>
</tr>
<tr id="ShippingCompanyNameRow">
<th >Company : </th>
<td colspan="3" >
<!-- same problem -->
<input type="text" id="ShippingCompanyName" name="ShippingCompanyName" size="35" maxlength="50" onkeydown="onchengeAddress('Left');" value="" />
<span id="ShippingCompanyNameMessage" ></span>
</td>
</tr>
<tr id="ShippingNameRow">
<th >First name : </th>
<td >
<input type="text" id="ShippingFirstName" name="ShippingFirstName" size="10" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
<th >Last name : </th>
<td >
<input type="text" id="ShippingLastName" name="ShippingLastName" size="7" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingTelRow">
<th >Telephone : </th>
<td colspan="3">
<input type="text" id="ShippingTel" name="ShippingTel" size="35" maxlength="20" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingAddressRows">
<th >Address : </th>
<td colspan="3">
<input type="text" id="ShippingAddress" name="ShippingAddress" size="35" maxlength="100" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingAddress2Rows">
<th ></th>
<td colspan="3">
<input type="text" id="ShippingAddress2" name="ShippingAddress2" size="35" maxlength="100" onkeydown="onchengeAddress('Left');isAddress()" value="" />
</td>
</tr>
<tr id="ShippingStatesRow">
<th >City:</th>
<td >
<input type="text" name="ShippingCity" id="ShippingCity" size="17" maxlength="25" value="" onkeydown="onchengeAddress('Left');isAddress()"/><span id="ShippingCityMessage" ></span>
</td>
<td colspan="2">State:<select onchange="isAddress();onchengeAddress('Left');" name="ShippingStateSn" id="ShippingStateSn"><option selected value="0">Select...</option><option value="12">Alabama</option><option value="14">Alaska</option><option value="16">Arizona</option><option value="18">Arkansas</option><option value="8">California</option><option value="20">Colorado</option><option value="22">Connecticut</option><option value="24">Delaware</option><option value="26">Florida</option><option value="28">Georgia</option><option value="30">Hawaii</option><option value="32">Idaho</option><option value="34">Illinois</option><option value="36">Indiana</option><option value="38">Iowa</option><option value="40">Kansas</option><option value="42">Kentucky</option><option value="44">Lousiana</option><option value="46">Maine</option><option value="48">Maryland</option><option value="50">Massachusetts</option><option value="6">Miami</option><option value="52">Michigan</option><option value="54">Minnesota</option><option value="56">Mississippi</option><option value="58">Missouri</option><option value="60">Montana</option><option value="62">Nebraska</option><option value="64">Nevada</option><option value="66">New Hampshire</option><option value="68">New Jersey</option><option value="70">New Mexico</option><option value="5">New York</option><option value="72">North Carolina</option><option value="74">North Dakota</option><option value="3">Ohio</option><option value="76">Oklahoma</option><option value="78">Oregon</option><option value="80">Pennsylvania</option><option value="82">Rhode Island</option><option value="84">South Carolina</option><option value="86">South Dakota</option><option value="88">Tennessee</option><option value="90">Texas</option><option value="92">Utah</option><option value="94">Vermont</option><option value="96">Virginia</option><option value="98">Washington</option><option value="100">West Virginia</option><option value="102">Wisconsin</option><option value="104">Wyoming</option></select>
</td>
</tr>
<tr id="ShippingCountryRow">
<th >Zip Code:</th>
<td>
<input type="text" name="ShippingZipCode" id="ShippingZipCode" onkeyup="copyZip(0)" maxlength="8" maxlength="7" size="8" value="" onkeydown="onchengeAddress('Left');isAddress()" />
</td>
<td colspan="2">Country:<select onchange="switchStates(this.value, 'ShippingStateSn'); isAddress();onchengeAddress('Left');copyCountry(0);" name="ShippingCountrySn" id="ShippingCountrySn"><option value="0">Select...</option><option value="7">Canada</option><option selected value="4">USA</option></select>
<span id="ShippingCountryMessage" ></span>
</td>
</tr>
<tr id="ShippingMessageRow">
<td></td>
<td colspan="3" >
<span id="ShippingMessage" name="ShippingMessage" ></span>
</td>
</tr>
<tr >
<td colspan="2" id="UnimportantInfo" >
<a href="#" id="UnimportantInfoAhref" onclick="showUnimportantInfo()"> [ UnimportantInfoAhref ] </a>
</td>
<td colspan="2" id="DuplicateRightRow" >
<a href="#" id="DuplicateRightAhref" > [ Duplicate Right ] </a>
</td>
</tr></table><script>var b_flag = 0;
function $(id) {
return document.getElementById(id);
}
function showUnimportantInfo() {
if(b_flag) {
$('ShippingCompanyNameRow').style.display = '';
$('ShippingNameRow').style.display = '';
$('ShippingTelRow').style.display = '';
//$('BillingCompanyNameRow').style.display = '';
//$('BillingNameRow').style.display = '';
//$('BillingTelRow').style.display = '';
b_flag = 0;
} else {
$('ShippingCompanyNameRow').style.display = 'none';
$('ShippingNameRow').style.display = 'none';
$('ShippingTelRow').style.display = 'none';
b_flag = 1;
}
}
</script>我点击[ UnimportantInfoAhref ]隐藏ShippingCompanyNameRow, ShippingNameRow, ShippingTelRow
后表格被拉大了
再点击后显示,我想知道什么原因把这个表格给拉大了
<col style="width:100px" />
<col style="width:70px" />
<col style="width:90px" />
<col style="width:80px" />
</colgroup>我用这个限制了四列的宽度还是不行,
FF和google下是正常的