みかづきブログ その3

3ヶ月つづけてみました。

JavaScriptの力をつかってformのパーツを選択状態する

セレクトボックス、チェックボックス、ラジオボタンをJavaScriptの力をつかって選択状態にしてみました。


セレクトボックス

セレクトタグのvalueに選択状態にしたいオプションタグのvalueをいれます。

JavaScript
doc.getElementById("select1").value = "katsudon";

チェックボックス

チェックをいれたいインプットタグのcheckedをtrueにします。

JavaScript
doc.getElementById("select1").checked = true;

jQueryを使っていれば .prop をつかって checked の値を true にしてチェックをいれることもできます。

$("#select1").prop("checked", true);

ラジオボタン

チェックをいれたいインプットタグのcheckedをtrueにします。

doc.getElementById("radio").checked = true;

やはりjQueryを使っていれば .prop をつかって checked の値を true にしてチェックをいれることもできます。

$("select1").prop("checked", true);

DEMO

カツ丼ボタンを押すとあらゆるパーツがカツ丼を選択します。