Изменить ссылку на основе выбора переключателя

Question

Я пытаюсь изменить ссылку на основе выбора радио. Я на самом деле могу заставить его работать, но не могу щелкнуть правой кнопкой мыши и открыть ссылку в новой вкладке. Вот мой код

<label class="container">One
  <input type="radio" id="optionone" checked="checked" name="radio">
</label>

<label class="container">Two
  <input type="radio" id="optiontwo" name="radio">
</label>

<label class="container">Three
  <input type="radio" id="optionthree" name="radio">
</label>

<div>
  <a href="" onclick='myFunction()' id="linkid">Click Here</a>
</div>

Js код для изменения ссылки

<script>
    function myFunction() {

        if(document.getElementById('optionone').checked) {
            document.getElementById('linkid').href = "#link1";
        }

      if(document.getElementById('optiontwo').checked) {
            document.getElementById('linkid').href = "#link2";
        }

      if(document.getElementById('optionthree').checked) {
            document.getElementById('linkid').href = "#link3";
        }
    }
</script>

Как я уже говорил выше, это работает, но не в том случае, если пользователь хочет открыть ссылку в новой вкладке .

Answer 1

Вместо этого добавьте onclick к переключателям, изменив href ссылки до щелчка или щелчка правой кнопкой мыши по ссылке.