1

ラジオボタンがあります。hrefラジオ ボタンが選択されていない場合はエラーを表示し、ラジオ ボタンが選択されている場合は属性で指定された URL にリダイレクトする "Submit" アンカー タグの検証を実装したいと考えています。

以下はラジオボタンのコードです -

<div>
    <input required="" type="radio" id="group02-0" name="group02" value="Yes" onclick="yesnoCheck();">
    <label for="group02-0" >Yes</label>
    <input type="radio" id="group02-1" name="group02" value="No" onclick="yesnoCheck();">
    <label for="group02-1">No</label>
</div>

<script>
    var radio_value = "";
    function yesnoCheck() {
        radio_value = document.querySelector('input[name="group02"]:checked').value;
    }
</script>

同じHTMLファイルに、Submit Anchor タグのコードがあります -

<a href="https://www.google.com" onclick="return submitCheck();"><span>Submit</span></a>

<script>
    function submitCheck() {
        if (radio_value === "") {
            //Display an error. The user should not be taken to the next page
            return false;
        } else {
            //User should be taken to the URL in the href attribute
            return true;
        }
    }
    </script>

ラジオ ボタンで選択するかどうかに関係なく、アンカー タグは常に次のページに移動します。助けてください!

4

2 に答える 2