Javascript 如何根据选择的下拉列表值更改窗体值操作

我有两个表单第一个表单包含两个下拉元素。我希望第二个表单操作值根据在表单1中选择的下拉值进行更改

表格1

<form method="post" style="padding: 10px 0px 10px 5px;">
<label>Front/Rear Tire:<br/><select name="tire" class="first">
<option  value="">Select</option>
  <option  value="rear">Rear Tire</option>
  <option  value="front">Front Tire</option>

</select> </label>
  <label>Tractor Type:<br/><select name="tractor" class="second" disabled>
    <option value="">Select Type</option>
    <option value="2wd">2WD</option>
    <option value="mfwd">MFWD</option>
    <option value="4wd">4WD</option>

  </select>  </label>


</form>

前/后轮胎：

挑选
后轮胎
前轮胎
拖拉机类型：

选择类型
两轮驱动
MFWD
四轮驱动

表格2看起来像

<form method="post" action="A.php" >
</form>

我想要

如果选择了后轮胎和（2WD或4wd），我想将

操作

值更改为'A.php`

如果选择了后轮胎和（MFWD），我想将

操作
值更改为'B.php`

如果选择了前轮胎和（2WD或$wd），我想将

action

值更改为'C.php'`

如果选择了前轮胎和（MFWD），我想将

action

值更改为'D.php`

---

我使用数据属性来存储文件名。您需要确保

first

select中的属性名称与

second

select中的值相同

<option  value="rear" data-2wd="A.php" data-4wd="A.php" data-mfwd="B.php" >Rear Tire</option>
<option  value="front" data-2wd="C.php" data-4wd="C.php" data-mfwd="D.php" >Front Tire</option>

---

请参阅此项。

我已使用数据属性存储文件名。您需要确保

first

select中的属性名称与

second

select中的值相同

<option  value="rear" data-2wd="A.php" data-4wd="A.php" data-mfwd="B.php" >Rear Tire</option>
<option  value="front" data-2wd="C.php" data-4wd="C.php" data-mfwd="D.php" >Front Tire</option>

---

请参考此项。

可以使用小jQuery代码

<form method="post" style="padding: 10px 0px 10px 5px;">
<label>Front/Rear Tire:<br/><select name="tire" class="first">
<option  value="">Select</option>
  <option  value="rear">Rear Tire</option>
  <option  value="front">Front Tire</option>

</select id="drop"> </label>
  <label>Tractor Type:<br/><select name="tractor" class="second" disabled>
    <option value="">Select Type</option>
    <option value="2wd">2WD</option>
    <option value="mfwd">MFWD</option>
    <option value="4wd">4WD</option>

  </select>  </label>


</form>

<form method="post" action="A.php" id="form2">
</form>

<script>
  var drop=$('#drop');
  var form=$('#form2)

drop.change(function(){
  var a= drop.val();
  // here i show you how to add drop down value to form action
  form.attr('action',a);
})
</script>

前/后轮胎：

挑选
后轮胎
前轮胎
拖拉机类型：

选择类型
两轮驱动
MFWD
四轮驱动
var-drop=$（“#drop”）；
变量形式=$（'#形式2）
drop.change（函数（）{
var a=drop.val（）；
//这里我向您展示如何添加下拉值以形成动作
表1.attr（“行动”，a）；
})

可以使用小jQuery代码

<form method="post" style="padding: 10px 0px 10px 5px;">
<label>Front/Rear Tire:<br/><select name="tire" class="first">
<option  value="">Select</option>
  <option  value="rear">Rear Tire</option>
  <option  value="front">Front Tire</option>

</select id="drop"> </label>
  <label>Tractor Type:<br/><select name="tractor" class="second" disabled>
    <option value="">Select Type</option>
    <option value="2wd">2WD</option>
    <option value="mfwd">MFWD</option>
    <option value="4wd">4WD</option>

  </select>  </label>


</form>

<form method="post" action="A.php" id="form2">
</form>

<script>
  var drop=$('#drop');
  var form=$('#form2)

drop.change(function(){
  var a= drop.val();
  // here i show you how to add drop down value to form action
  form.attr('action',a);
})
</script>

前/后轮胎：

挑选
后轮胎
前轮胎
拖拉机类型：

选择类型
两轮驱动
MFWD
四轮驱动
var-drop=$（“#drop”）；
变量形式=$（'#形式2）
drop.change（函数（）{
var a=drop.val（）；
//这里我向您展示如何添加下拉值以形成动作
表1.attr（“行动”，a）；
})

可能重复的@Guratio我尝试使用Javascript案例，但没有改变它可能重复的@Guratio我尝试使用Javascript案例，但没有改变它如果我想在点击第二个表单上的按钮时触发该操作怎么办？我所做的是基本功能。您需要在

change

event中添加案例谢谢！！但正如我在问题的底部所提到的，两个下拉列表在后+2wd、后+4wd、前+2wd、前+4wd的情况下会有不同的动作。我如何管理它？请参阅编辑中更新的小提琴。对不起，我之前没有理解你的问题，所以没有考虑<代码>第二版/代码>选择。谢谢它的工作，但是前面和后面都在不同的目录/路径上，你的代码对所有的后轮胎都很好。这是后+2wd、后+4wd、后+MFWD，但当选择前+MFWD时，会显示后页。如果我想在单击第二个表单上的按钮时触发该操作，该怎么办？我所做的是基本功能。您需要在

change

event中添加案例谢谢！！但正如我在问题的底部所提到的，两个下拉列表在后+2wd、后+4wd、前+2wd、前+4wd的情况下会有不同的动作。我如何管理它？请参阅编辑中更新的小提琴。对不起，我之前没有理解你的问题，所以没有考虑<代码>第二版/代码>选择。谢谢它的工作，但是前面和后面都在不同的目录/路径上，你的代码对所有的后轮胎都很好。它是后+2wd、后+4wd、后+MFWD，但当选择前+MFWD时，会显示后面的页面。