如何使用JavaScript函数根据单选按钮的选择使表单提交按钮打开其他URL？

问题描述

我是JavaScript的新手，如果真的很简单，那就对不起...

我要完成的工作：

具有一个带有10个不同单选按钮选择的表单。 在“提交”按钮上单击后，应根据用户的选择将其重定向到新的URL。

这是我的HTML表单：

<form onsubmit="myFunction()" class="final_question">
    <div class="question-container">
        <div class="form-box first-answer">
        <label for="Option1">Option 1</label>
        <input type="radio" id="Option1" name="option">
        </div>

        <div class="form-box second-answer">
        <label for="Option2">Option 2</label>
        <input type="radio" id="Option2" name="option">
        </div>

        <div class="form-box third-answer">
        <label for="Option3">Option 3</label>
        <input type="radio" id="Option3" name="option">
        </div>

        <div class="form-box fourth-answer">
        <label for="Option4">Option 4</label>
        <input type="radio" id="Option4" name="option">
        </div>

        <div class="form-box fifth-answer">
        <label for="Option5">Option 5</label>
        <input type="radio" id="Option5" name="option">
        </div>

        <div class="form-box sixth-answer">
        <label for="Option6">Option 6</label>
        <input type="radio" id="Option6" name="option">
        </div>

        <div class="form-box seventh-answer">
        <label for="Option7">Option 7</label>
        <input type="radio" id="Option7" name="option">
        </div>

        <div class="form-box eighth-answer">
        <label for="Option8">Option 8</label>
        <input type="radio" id="Option8" name="option">
        </div>

        <div class="form-box ninth-answer">
        <label for="Option9">Option 9</label>
        <input type="radio" id="Option9" name="option">
        </div>

        <div class="form-box tenth-answer">
        <label for="Option10">Option 10</label>
        <input type="radio" id="Option10" name="option">
        </div>
        
        <div class="form-box submit-button">
        <input type="submit" class="final_question_submit" id="mysubmit">
        </div>
    </div>
</form>

这是我的JavaScript函数（插入了虚拟网址）：

function myFunction() {
    if(document.getElementById('Option1').checked) {
        document.getElementById('mysubmit').href = "https://www.google.com";
    }
    else if(document.getElementById('Option2').checked) {
        document.getElementById('mysubmit').href = "https://facebook.com";
    }
    else if(document.getElementById('Option3').checked) {
        document.getElementById('mysubmit').href = "https://www.instagram.com";
    }
    else if(document.getElementById('Option4').checked) {
        document.getElementById('mysubmit').href = "https://www.twitter.com";
    }
    else if(document.getElementById('Option5').checked) {
        document.getElementById('mysubmit').href = "https://www.stackoverflow.com";
    }
    else if(document.getElementById('Option6').checked) {
        document.getElementById('mysubmit').href = "https://www.w3cschools.com";
    }
    else if(document.getElementById('Option7').checked) {
        document.getElementById('mysubmit').href = "https://www.freecodecamp.org";
    }
    else if(document.getElementById('Option8').checked) {
        document.getElementById('mysubmit').href = "https://www.edabit.com";
    }
    else if(document.getElementById('Option9').checked) {
        document.getElementById('mysubmit').href = "https://www.scrimba.com";
    }
    else(document.getElementById('Option10').checked) {
        document.getElementById('mysubmit').href = "https://www.javascript.com";
    }
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）