【JavaScript】ラジオボタンにリンクを設置する方法。
Ads by Google
フォームのラジオボタンにリンクを設置して、クリックした際に指定した URL に移動させる方法を紹介します。
以下、簡単なコードで実装できます。
<form> <input type="radio" id="radio-01" value="https://on-ze.com" onclick="location.href=this.value"><label for="radio-01">https://on-ze.com</label> </form>
ラジオボタンに JavaScript の[onclick]要素を追加して、[value]で指定した URL にリンクさせる仕組みになっています。
このやり方だとリンク先のページを同ウィンドウで開きますが、もし別ウィンドウ開く[target="_blank"]と同じ挙動にさせたいなら、[window.open]を使います。
具体的なコードは以下。
<form> <input type="radio" id="radio-02" value="https://on-ze.com" onclick="window.open(href=this.value);return false;"><label for="radio-02">https://on-ze.com</label> </form>
サンプルも用意しましたのでご確認ください。
ラジオボタンにリンクを設置する方法:サンプル・デモ
こちらの記事もいかがですか?
アナタにオススメ!
同じカテゴリーの他の記事です。
Ads by Google