[解決済み] ラジオボタンをクリックするとチェックが外れるようにするには?
2023-01-01 04:24:23
質問
チェックボックスと違い、ラジオボタンは一度クリックすると選択解除ができません。 Javascriptを使用してプログラム的に切り替えることができる方法はありますか? これは、できればjQueryを使用しないでください。
どのように解決するのですか?
HTMLオブジェクトのプロパティである
checked
を
false
のようにします。
document.getElementById('desiredInput').checked = false;
例
Plain JavaScript
:
var radios = document.getElementsByTagName('input');
for(i=0; i<radios.length; i++ ) {
radios[i].onclick = function(e) {
if(e.ctrlKey || e.metaKey) {
this.checked = false;
}
}
}
<input type="radio" name="test" value="1" />
<input type="radio" name="test" value="2" checked="checked" />
<input type="radio" name="test" value="3" />
jQuery
:
$('input').click(function(e){
if (e.ctrlKey || e.metaKey) {
$(this).prop('checked', false);
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" name="test" value="1" />
<input type="radio" name="test" value="2" checked="checked" />
<input type="radio" name="test" value="3" />
押さえる Ctrl ( ⌘ on mac)キーでチェックが外れます。
関連
-
[解決済み] ラジオボタンのチェックをはずすには?
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] event.preventDefault() vs. return false
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] リンクのように動作するHTMLボタンを作成する方法
-
[解決済み] モバイル端末の検出にはどのような方法がありますか?
-
[解決済み] jQueryのdocument.createElementと同等?
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み] AngularJSのエラーです。Cross Origin リクエストはプロトコルスキーム http, data, chrome-extension, https に対してのみサポートされています。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] オブジェクトの配列からReactコンポーネントをレンダリングする
-
[解決済み] JavaScriptでの大文字小文字を区別しない正規表現
-
[解決済み] moment.jsでミュータビリティを回避するには?
-
[解決済み] Reactメモを使うべきではない場合とは?
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] 各オブジェクトに?重複
-
[解決済み] Promise : then vs then + catch [重複].
-
[解決済み] JavaScript で `throw` の後に `return` をする必要がありますか?
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?