html - フォームのラジオ ボタンが機能しない

Question

いくつかの単純な HTMl、スタイリング用にスパンを追加しましたが、代わりにラベルを使用する必要がありますか? 一度に選択できるのは 1 つだけです。私は何を間違っていますか？私は符号盲です :P

ここでJSfiddle。

ありがとう。

Answer 1

ラジオ グループは、同じ名前の多数のラジオ ボタンを持つことによって作成されます。

多数のラジオ グループがあり、それぞれに 1 つのボタンが含まれています。

スタイリングのためにラベルを追加するべきではありませんが、ラジオ ボタンのラベルをラジオ ボタンに関連付けるためにラベルを追加する必要があります。

Answer 2

ラジオボタンを次のようにグループ化する必要があります。

<form>
    <span id="betalfakturavalg">
        <input type="radio" name="group1" title="Valg Faktura"
        onclick="document.getElementById('betalfakturavalg').style.cssText='border-color:#85c222; background-color:#E5F7C7;';" /> Faktura - For bedrifter  
    </span>
    <br>
    <span id="betalkortvalg">
        <input type="radio" name="group1" title="Valg Kreditkort"
        onclick="document.getElementById('betalkortvalg').style.cssText='border-color:#85c222; background-color:#E5F7C7;';" /> Kreditkort - For alle privatpersoner
    </span>
</form>

Answer 3

ラジオボタンで単一の名前を使用し、

<form>
    <span id="betalfakturavalg">
        <input type="radio" name="betalfakturavalg" title="Valg Faktura"
        onclick="document.getElementById('betalfakturavalg').style.cssText='border-color:#85c222; background-color:#E5F7C7;';" /> Faktura - For bedrifter  
    </span>
    <br>
    <span id="betalkortvalg">
        <input type="radio" name="betalfakturavalg" title="Valg Kreditkort"
        onclick="document.getElementById('betalkortvalg').style.cssText='border-color:#85c222; background-color:#E5F7C7;';" /> Kreditkort - For alle privatpersoner
    </span>
</form>