Переадресация на основе радиокнопки

Question

Я хотел бы знать, есть ли способ в HTML5, чтобы взять пользователя на конкретную страницу на основе того, что пользователь выбирает для выбора переключателя с помощью HTML5.

Например, если пользователь выбирает кнопку радио «мужской» и хитов представить, то я хочу взять его .../male.html или если женщина выбрана, а затем представить щелкают затем взять ее .../female.html

Если его нет это можно сделать в HTML5, я мог бы что-то понять в javascript, несмотря на отсутствие опыта работы с этим языком. Тем не менее, я не знаю, как реализовать код для запуска только при нажатии кнопки «Отправить», не могли бы вы дать мне небольшое руководство?

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

Answer 1

HTML (5):

<form id="form"> 
    <input type="radio" name="gender" id="gender-male" value="Male" /> 
    <input type="radio" name="gender" id="gender-female" value="Female" /> 
</form> 

JS (5):

var submit = function (e) { 
    if (e.preventDefault) { 
     e.preventDefault(); 
    } 

    if (document.getElementById('gender-male').checked) { 
     window.location = 'male.html'; 
    } else if (document.getElementById('gender-female').checked) { 
     window.location = 'female.html'; 
    } 

    return false; 
}; 

window.onload = function() { 
    var form = document.getElementById('form'); 

    if (form.attachEvent) { 
     form.attachEvent('submit', submit); 
    } else { 
     form.addEventListener('submit', submit); 
    } 
} 

Answer 2

Создали jsfiddle, чтобы продемонстрировать, как это может быть сделано с HTML и Javascript. Невозможно сделать это только с помощью HTML.

http://jsfiddle.net/benwong/W4FVC/

HTML

<input id="MaleRadio" type="radio" name="sex" value="male" checked="checked">male</input> 
<input id="FemaleRadio" type="radio" name="sex" value="female">female</input> 
<input id="SubmitButton" type="submit" value="submit" /> 

Javascript

var maleRadio = document.getElementById("MaleRadio"), 
    femaleRadio = document.getElementById("FemaleRadio"), 
    submitButton = document.getElementById("SubmitButton"); 

submitButton.addEventListener("click", function() { 
    if (maleRadio.checked) { 
     alert('male'); 
     window.location = "male.html"; 
    } else { 
     alert('female'); 
     window.location = "female.html"; 
    } 
}, false);