Перенаправление на определенные страницы после выбора переключателя - PullRequest
4 голосов
/ 03 мая 2019

Я хотел бы перенаправить на одну из двух страниц, содержащих две отдельные основные математические функции в Javascript. Страницы должны быть связаны с одной из двух заданных кнопок-переключателей и перенаправлены после нажатия пользователем кнопки «все в порядке».

function myFunction() {
  var x = document.getElementById("x");
  var y = document.getElementById("y")

  if (x.checked = true); {
    //* redirect link when Okay button is click 
  } else(y.checked = true); {
    //* redirect link when Okay button is clicked
  }
}
<!DOCTYPE html>
<html>

<body>

  <p>What would you like to convert?</p>

  <form action="/action_page.php">
    <input type="radio" name="converter" value="grams" id="x">Grams to ounces
    <br>
    <input type="radio" name="converter" value="ounces" id="y">Ounces to grams
    <br>
    <br>
    <input type="button" onclick="myFunction()" value="Okay!">
    <br>
  </form>


</body>

</html>

Ответы [ 3 ]

3 голосов
/ 03 мая 2019

Вы должны использовать поле выбора, вам будет легче

<select id="myChoice">
  <option value="grams">grams</option>
  <option value="ounces">ounces</option>
</select>

и в вашем JS

 function myFunction() {
  var theChoice = document.getElementById("myChoice")

  switch (theChoice.value){
    case 'grams':
         //redirect;
         break;
    case 'ounces':
         //redirect
         break;
}
1 голос
/ 03 мая 2019

это просто, просто создайте элемент типа a, поместите атрибуты и имитируйте click() для перенаправления

вот пример пера: https://codepen.io/lucassoomago/pen/YbKwJx

следующий пример не перенаправляет, потому что переполнение стека не позволяет, если вы хотите увидеть перенаправление, используйте ссылку выше

      function myFunction() {
        var x = document.getElementById("x");
        var y = document.getElementById("y")

        var a = document.createElement("a");

        if (x.checked == true)
        {
          a.setAttribute('href', 'https://www.google.com');
          a.setAttribute('target', 'blank');
        }else if (y.checked == true)
        {
          a.setAttribute('href', 'https://www.youtube.com');
          a.setAttribute('target', 'blank');
        }
      
        a.click()
      }
     <p>What would you like to convert?</p>

    <form action="/action_page.php">
       <input type="radio" name="converter" value="grams" id="x">Grams to 
        ounces<br>
       <input type="radio" name="converter" value="ounces" id="y">Ounces to 
        grams<br>
       <br>
       <input type="button" onclick="myFunction()" value="Okay!">
       <br>
       </form>
0 голосов
/ 03 мая 2019

Следующая команда проверит, установлен ли флажок, а затем перенаправит вас на указанный вами URL-адрес. Я использовал else if, так как else перенаправил бы вас в местоположение y, если бы ни один из флажков не был установлен в вашем примере.

<form action="/action_page.php">
    <input type="radio" name="converter" value="grams" id="x">Grams to
    ounces<br>
    <input type="radio" name="converter" value="ounces" id="y">Ounces to
    grams<br>
    <br>
    <input type="button" onclick="myFunction()" value="Okay!">
    <br>
</form>
<script>
  function myFunction() {
  var x = document.getElementById("x");
  var y = document.getElementById("y")

  if (x.checked)
  {
     window.location.replace("url");
  }
  else if (y.checked)
  {
     window.location.replace("url");
  }
  }
  </script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...