Question

我有两种形式，第一种形式包含两个下拉元素。我希望根据在表单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>

表单2看起来像

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

我想要。

如果选择后轮胎和（2WD或4wd）我想将action值更改为＆＃39; A.php`
如果选择了后轮胎和（MFWD），我想将action值更改为＆＃39; B.php`
如果选择Front Tire和（2WD或$ wd）我想将action值更改为＆＃39; C.php`
如果选择前轮胎和（MFWD）我想将action值更改为＆＃39; D.php`

Answer 1

我使用数据属性来存储文件名。您需要确保create_tables();中的属性名称与first选择中的值相同。

second

使用<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>事件与委托change获取选择菜单中的更改。

on

请参阅此fiddle。

Answer 2

可以使用小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>

如何根据所选的下拉值更改表单值操作

2 个答案: