やりたいこと
・formのcheckboxがチェックされたら、それをトリガーにしてtext型のフォームに文字を入れる
・formのcheckboxがチェックが外されたら、それをトリガーにしてtext型のフォームから文字を消す
■ 過去記事 : 【Javascript】URLのクエリ情報からhtmlのフォームを埋める/チェックボックスをチェックする
↑これに似てるが、チェックボックスが外れた時にも対応しないといけないのでこの方法ではダメ
javascriptでoncheckedというcheckboxがチェックされたことを受け取るイベントハンドラがあるけど、
これだと、チェックが外れた時に対応できない
なので、onchangeというイベントハンドラを使う
■ 参考 : onchange - 変更があった時に発火する
syncer.jp
・htmlコードにcheckboxを用意する
・checkboxにidを設定する
・checkboxに onchange="isChecked1(n)" のように追記しておく
・これで、このcheckboxが変更された時にisCheckedというjavascriptの関数が走る、nは引数
・javascriptで、そのisChecked()の中身を書く
function isChecked1(n) { if (document.getElementById(n).checked) { parent.document.getElementById("list_reference").value = parent.document.getElementById("list_reference").value + n + ' '; } else{ parent.document.getElementById("list_reference").value = parent.document.getElementById("list_reference").value.replace(n + ' ', ''); } }
これで、checkboxがチェックされた時に元のhtmlの中のlist_referenceというテキストフォームにnと空白を追記する
チェックが外れたら、nと空白を消す
ランキング参加中です
↓クリックしていただけると嬉しいです〜