Question

我正在尝试下拉选项，更改表单操作，这会在提交时将用户带到另一个链接。

我已经尝试了我认为应该工作但却无法做到的事情，对于我在这里做错了什么的任何帮助都会受到很大的赞赏。

JS

$("#time-select").change(function() {

  if (document.getElementById("time-select").value != "WEEK")
  { 
    document.getElementById("subs-form").setAttribute("action", "A");
  }

  else (document.getElementById("time-select").value != "FORTNIGHT")
  { 
    document.getElementById("subs-form").setAttribute("action", "B" );
  }

  else (document.getElementById("time-select").value != "MONTH")
  { 
    document.getElementById("subs-form").setAttribute("action", "C" );
  }

}

HTML

<div class="wrapper">                              
 <form name="linkForm" id="subs-form" action="" method="GET" >

   <select id="time-select" >
    <option value="WEEK" selected>1 BAG A WEEK</option>
    <option value="FORTNIGHT">1 BAG A FORTNIGHT</option>
    <option value="MONTH">1 BAG A MONTH</option>
   </select>

    <input id="subs-submit" type="submit" value="Subscibe">

 </form>
</div>

Answer 1

尽可能保持代码清洁（例如使用jQuery选择器），请参阅以下示例：

$("#time-select").change(function() {
  var value = $(this).val(),
      action = null;

  switch(value) {
    case "WEEK":
      action = "A"
      break;
    case "FORTNIGHT":
      action = "B"
      break;
    case "MONTH":
      action = "A"
      break;
  }

  $("#subs-form").attr("action", action);
}

Answer 2

$("#time-select").change(function() {
    var option = document.getElementById("time-select").value;
    var el = document.getElementById("subs-form");

    switch(option) {
    case "WEEK":
      action = "A"
      break;
    case "FORTNIGHT":
      action = "B"
      break;
    case "MONTH":
      action = "C"
      break;
    }
  el.setAttribute("action", action);    
});

Answer 3

working fiddle with nicer code.

    $("#time-select").on('change', function() {
        var value = $(this).val();
        if (value !== "WEEK")
           document.getElementById("subs-form").setAttribute("action", "A");
        else if (value !== "FORTNIGHT") 
           document.getElementById("subs-form").setAttribute("action", "B" )
        else if (value !== "MONTH")
           document.getElementById("subs-form").setAttribute("action", "C" ); 
});

如何设置选择选项以更改表单操作

3 个答案: