Question

我是新手，我不知道任何关于JS或CSS的事如何根据所选的选项将用户重定向到另一个页面（单击按钮后，而不是在选择了选项后）例如，如果我选择Veg并点击“完成”按钮，我应该被带到VegMenu.html，如果我选择Non-veg，我应该被带到NonVegMenu.html
我尝试了 this ，但是当我选择了我不想要的选项时，我被重定向到页面。我想按“完成”后重定向

<input type="text" name="name"></input>
<br><br>
<select id="Opt">
<option>Veg</option>
<option>Non-Veg</option>
</select>
<br><br>
<input type="text" name="age"></input>
<br><br>
<button>Done</button>

Answer 1

你可以使用类似的东西（未经测试）

<script>
    function redirectMe() {
        var selectedIndex = document.getElementById("Opt").selectedIndex;
        var selectedText = document.getElementById("Opt").options[selectedIndex].text; 

        if (selectedText == "Veg") {
           location.href = "VegMenu.html";
        }
        else {
           location.href = "NonVegMenu.html";
        }
    }
</script>


<select id="Opt">
    <option>Veg</option>
    <option>Non-Veg</option>
</select>

<button onClick="redirectMe()">Done</button>

Answer 2

$('#but').click(function(e){
  var food = $("#Opt").val();
  if(food == 'Veg')
    location.href = "www.abc.com/veg.html";
  else if (food == "Non-Veg")
    location.href = "www.abc.com/non-veg.html"
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Name:
<input type="text" name="name"></input>
<br>
<br>Food:
<select id="Opt">
  <option value="Veg">Veg</option>
  <option value="Non-Veg">Non-Veg</option>
</select>
<br>
<br>Age:
<input type="text" name="age"></input>
<br>
<br>
<button id="but">Done</button>

希望这有帮助。

Answer 3

使用简单的javascript：

var makePath = function(form) {
  form.action = document.getElementById('Opt').value;
};

<form onsubmit='makePath(this);'>
  <select id="Opt">
    <option value='VegMenu.html' label='Veg' />
    <option value='NonVegMenu.html' label='Non-Veg' />
  </select>
  <button>Done</button>
</form>

Answer 4

＆＃13;

input type="text" name="name"></input>
<br><br>
<select id="Opt">
<option>Veg</option>
<option>Non-Veg</option>
</select>
<br><br>
<input type="text" name="age"></input>
<br><br>
<button onclick="location.href=(document.getElementById('Opt').selectedIndex==1)?'1.html':'2.html';">Done</button>

＆＃13;

如何根据html中的选项/选择重定向用户（单击按钮后）

4 个答案: