根据下拉选择在 AJAX/Javascript/HTML 中创建表单时遇到问题

Question

我的工作需要一个非常简单的 Web 表单，我们将使用它来提交内部工作。作品提交将分为 4 个类别，每个类别都需要独特的信息。现在我有一个简单的表单，它执行以下操作：

请求的名称：[文本框]
请求日期：[文本框]
获取：[文本框]
请求类型：[下拉] 4 项

我想要的是取决于选择的下拉项目，用户应该会看到下面显示的正确表单。其中将包含一个表格形式更多“输入的项目和文本框”。

现在我正在尝试这个，但我遇到了多个问题，即我只能看到一个表格行，而不是选择的所有内容。

所以也许我以错误的方式解决问题？所以我要投身于你面前，谦卑地寻求帮助。要么是正确方向的点，要么是此时的任何东西！

$(document).ready(function() {
   $('select[name="select_main_table"]').change(function() {
      $("#main_table tr").hide().eq(this.value-1).show();
   }).change();
});



      <td><label for="typeofrequest">Type of Request</label></td>
      <td><select name="select_main_table">
        <option value="" selected="selected"> - Choose -</option>
        <option value="1">Office Move</option>
        <option value="2">Office Closure</option>
        <option value="3">New Office</option>
        <option value="4">New Service</option>
      </select>          </td>
      <td>&nbsp;</td>
    </tr>

   <table id="main_table">
    <tr> 
      <td><label for="sitecontactname">Site Contact Name</label></td>
      <td><input type="text" class="validate[required,custom[sitecontactname]]" name="sitecontactname" id="sitecontactname" value="" /></td>
      <td>&nbsp;</td>
    </tr>

    <tr>  
      <td><label for="sitecontacttitle">Site Contact Title</label></td>
      <td><input type="text" class="validate[required,custom[sitecontacttitle]]" name="sitecontacttitle" id="sitecontacttitle" value="" /></td>
      <td>&nbsp;</td>
    </tr>

    <tr> 
      <td><label for="sitecontactemail">Site Contact Email</label></td>
      <td><input type="text" class="validate[required,custom[sitecontactemail]]" name="sitecontactemail" id="sitecontactemail" value="" /></td>
      <td>&nbsp;</td>
    </tr>

    <tr>  
      <td><label for="sitecontacttelephonenumber">Site Contact Telephone Number</label></td>
      <td><input type="text" class="validate[required,custom[sitecontacttelephonenumber]]" name="sitecontacttelephonenumber" id="sitecontacttelephonenumber" value="" /></td>
      <td>&nbsp;</td>
    </tr>
   </table>

Answer 1

感谢您的帮助。我能够在另一个网站上找到一些代码，这些代码让我找到了更好的解决方案。