如何通过动态更改选项来保持正确的选择形式？

如何解决如何通过动态更改选项来保持正确的选择形式？

| 我有以下问题。我制作了一个表格，该表格根据选择的选项动态地更改表格元素。这是一个简短的示例：

<select name=\"vehicle\" id=\"vehicle\" onchange=\"$(\'#div\').load(\'data.PHP?vehicle=\'+this.value);\"> 
      <option value=\"1\"> motorcycle</option>
      <option value=\"2\">buss</option>
      <option value=\"3\"> truck </option>
      <option value=\"4\">. . .</option>
</select>
<div id=\"div\">
<select name=\"moto_type\" id=\"moto_type\">
      <option value=\"1\">Ducati</option>
      <option value=\"2\">Yamaha</option>
      <option value=\"3\">Kawasaki</option>
      <option value=\"4\">. . . </option>
</select>
</div>

从下拉菜单中选择总线后，＃div的内容将替换为总线可用的选项，例如：

<select name=\"bus_type\" id=\"bus_type\">
       <option value=\"1\">A-type</option>
       <option value=\"2\">B-type</option>
       <option value=\"3\">C-type</option>
       <option value=\"4\">. . .</option>
</select>
<select name=\"bus_seats\" id=\"bus_seats\">
       <option value=\"1\">10</option>
       <option value=\"2\">20</option>
       <option value=\"3\">50</option>
       <option value=\"4\">. . .</option>
</select>

同样，所有其他选项都会根据在第一个下拉菜单中选择的内容而变化。提交表单后，将处理结果并显示结果表。但是，如果用户单击编辑按钮以返回并编辑他们的选择，则会保存第一个下拉菜单中的选项（假设为bus），但#div中选项bus＃2（buss_type和bus_seats）的下拉菜单将替换为＃1摩托车（moto_type）的选项不正确。我了解发生这种情况的原因，但我不知道如何向用户显示正确的表单选择。当用户返回表单进行编辑时，如何在主下拉菜单中为每个值显示正确的子选项？ 任何帮助表示赞赏！ 附加问题： 如何在辅助下拉菜单中保留正确的选择，以使它们不会切换回默认值=“ 1”？     

解决方法

不要使用内联事件处理程序，它们只会使您头疼...它们不灵活，并且不允许您将语义标记和行为分开。 相反，请执行以下操作（您可以将其放在

body

之前的

script

标记中，最好与所有其他JS放在单独的文件中）：

$(document).ready(function () {

  $(\'#vehicle\').change(function () {
    $(\'#div\').load(\'data.php?vehicle=\'+$(this).val());
  }).change();

});

请注意，您将附加更改事件处理程序，然后立即调用它。这样可以确保它会同时加载页面加载和onchange加载。     ,还要检查表单的初始加载时间，而不仅是下拉菜单的更改。 我在动态显示div的asp中有类似的东西。我有一个可以完成工作的函数，我会在onchange以及表单最初加载时调用该函数。