Question

我确信这只是我错过了一些完全明显的东西，但我已经在这里坐了几个小时，并且仍然没有骰子。我将使用的修改版本的表格是：

<html>
  <head>
    <script language="javascript;" type="text/javascript">
    function setAction() {
        var country = document.getElementById("FormCtrl_1").value;
        var business = document.getElementById("FormCtrl_2").value;
        if (country === "Afghanistan" && business === "Yes") {
            window.location = "http://www.google.com";
        }
    }
    </script>
</head>
  <body>
    <form>
      <div class="row"> <label for="FormCtrl_1">Where are you going?</label>
        <select id="FormCtrl_1" name="FormCtrl_1">
          <option value="Afghanistan">Afghanistan</option>
          <option value="Albania">Albania</option>
          <option value="Algeria">Algeria</option>
        </select>
      </div>
      <div class="row">
        <fieldset>
          <legend>Is this a business trip?</legend>
          <span>
            <input value="Yes" id="FormCtrl_2_1" name="FormCtrl_2" type="radio">
            <label for="FormCtrl_2_1">Yes</label></span>
            <span>
              <input value="No" id="FormCtrl_2_2" name="FormCtrl_2" type="radio">
              <label for="FormCtrl_2_2">No</label>
            </span>
          </fieldset>
      </div>
      <div class="row">
        <input value="Submit" onclick="setAction()" type="button">
      </div>
    </form>
  </body>
</html>

这是通过其他问题和答案进行几次不同迭代的混搭，因此我完全有可能在某一点上比现在更接近，但它刚刚开始看起来像胡言乱语对我来说，所以我说的是“叔叔”并且问你很棒的人。提前谢谢！

Answer 1

从提交按钮中删除.onclick事件，而不是在表单元素上使用.onsubmit事件。像这样：

<form onsubmit="return setAction()" method="post" action="">
  <div class="row">
    <label for="FormCtrl_1">Where are you going?</label>
    <select id="FormCtrl_1" name="FormCtrl_1">
      <option value="Afghanistan">Afghanistan</option>
      <option value="Albania">Albania</option>
      <option value="Algeria">Algeria</option>
    </select>
  </div>
  <div class="row">
    <fieldset>
      <legend>Is this a business trip?</legend>
      <span>
        <input value="Yes" id="FormCtrl_2_1" name="FormCtrl_2" type="radio">
        <label for="FormCtrl_2_1">Yes</label>
      </span>
      <span>
        <input value="No" id="FormCtrl_2_2" name="FormCtrl_2" type="radio">
        <label for="FormCtrl_2_2">No</label>
      </span>
    </fieldset>
  </div>
  <div class="row">
    <input value="Submit" type="submit" />
  </div>
</form>

您的JavaScript也有一些问题。第一个问题是你得到一个值为“是”的无线电输入的值，而我们需要检查它是否被选中（选中）。下一个问题是您需要返回false，以防止表单提交并且页面不会重新加载。试一试：

function setAction() {
    var country = document.getElementById("FormCtrl_1").value;
    var business = document.getElementById("FormCtrl_2_1").checked;

    if (country === "Afghanistan" && business === true) {
        window.location = "http://www.google.com";
    }

    return false;
}

JSFiddle示例：http://jsfiddle.net/eF2wH/2/

JSFiddle注意：除非您使用Google以外的网址，否则重定向将无效

用于提交基于多个变量重定向的表单的JavaScript

1 个答案: