条件に基づいて表示される隠しフィールドがたくさんあるjspページがあります。以下は私のjspページのコードです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>E-Form </title>
<script type="text/javascript">
</script>
<SCRIPT language="JavaScript" src="/Eform/JS/common.js"></SCRIPT>
<link href='/Eform/CSS/common.css' rel="stylesheet" type="text/css">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
</head>
<body>
<!--form action="/Eform/SendMail" method="post" id='Eform' name='Eform'-->
<form action="/Eform/SendMail" method="post" enctype="multipart/form-data" id='Eform' name='Eform'>
<table width="800" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" align="center" class="text1">
<tr>
<td valign="middle">
<img border="0" src="/Eform/Images/Header.GIF" />
</td>
</tr>
<tr>
<td align="center" valign="middle" width="100%" class="headingText1">E-Form </td>
</tr>
<tr>
<td align="center" valign="middle" width="100%" height="50"></td>
</tr>
<tr>
<td valign="middle">
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" align="center" class="commonText1">
<tr>
<td height="20" valign="middle" align="right" width="40%">Account(Existing Customers) or Projected Monthly Balance(New Customers)* : </td>
<td height="20" valign="middle" align="left" width="60%">
<select tabindex="0" name="accOrBalType" id="accOrBalType" onchange="doClear();" class="text1">
<option selected value="">-- Select One & Enter a value in to text box below --</option>
<option value="1">Account(Existing Customers)</option>
<option value="2">Projected Monthly Balance(New Customers)</option>
</select>
</td>
</tr>
<tr id = "accountNumber" style = "visibility:hidden">
<td height="20" valign="middle" align="right" width="40%">Account Number* :</td>
<td height="20" valign="middle" align="left" width="60%"> <input type="text" class="text1" maxlength="20" name="accountNumber" size="20" onblur="selectFirst();" /></td>
</tr>
<tr id = "monthlyBalance" style = "visibility:hidden">
<td height="20" valign="middle" align="right" width="40%">Projected Monthly Balance* :</td>
<td height="20" valign="middle" align="left" width="60%"> <input type="text" class="text1" maxlength="20" name="monthlyBalance" size="20" onblur="selectFirst();" /></td>
</tr>
<tr id = "accEnrol" style = "visibility:hidden">
<td height="20" valign="middle" align="right" width="40%">Is the account already enrolled in a checking package or program?* : </td>
<td height="20" valign="middle" align="left" width="60%"> <input type="radio" class="text1" name="accEnrol" id="accEnrolY" value="Yes" onclick="packageName();"> Yes <input type="radio" class="text1" name="enrol" id="accEnrolN" value="No" onclick="packageName();"> No</td>
</tr>
<tr id = "packages" style = "visibility:hidden">
<td height="20" valign="middle" align="right" width="40%">Package Name* : </td>
<td height="20" valign="middle" align="left" width="60%"><input type="text" maxlength="100" class="text1" name="packages" size="50"/></td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Enrolled in Business Online* : </td>
<td height="20" valign="middle" align="left" width="60%"> <input type="radio" class="text1" name="enrol" value="Yes"> Yes <input type="radio" class="text1" name="enrol" value="No"> No</td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Company Name* : </td>
<td height="20" valign="middle" align="left" width="60%"><input type="text" maxlength="100" class="text1" name="cmpName" id="cmpName" size="50" /></td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Business Industry/Description Of Business Activity* : </td>
<td height="20" valign="middle" align="left" width="60%" class="text1">
<textarea class="text1" rows="4" cols="61" name="bussAct" id="bussAct"></textarea>
</td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Business Contact's First Name* : </td>
<td height="20" valign="middle" align="left" width="60%"><input type="text" maxlength="15" class="text1" name="fName" id="fName" size="20" /></td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Business Contact's Last Name* : </td>
<td height="20" valign="middle" align="left" width="60%"><input type="text" maxlength="15" class="text1" name="lName" id="lName" size="20"/></td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Business Contact's Telephone* : </td>
<td height="20" valign="middle" align="left" width="60%">
<input type="text" value=" +1-" size="1" readonly/>
<input type="text" maxlength="10" name="contTellNo" id="contTellNo" class="text1" size="11" />
</td>
</tr>
<tr>
<td height="20" valign="middle" align="right" width="40%">Business Contact's E-mail Address* : </td>
<td height="20" valign="middle" align="left" width="60%"><input type="text" maxlength="50" class="text1" name="emailAdd" id="emailAdd" size="30" /></td>
</table>
</form>
</body>
</html>
出力は次のようになります
最初のフィールドと 2 番目のフィールドの間に大きなギャップがあることに気付いた場合。すべての非表示フィールド用にスペースが自動的に残されます。なんかむずかしそうです。これを修正したい。