checkboxでイベントを確認する【javascript】

トップ】 【じんじんのいろいろ日記】 【カテゴリーサイトマップ

スポンサードリンク

【じんじん】
2024年12月11日
6時18分4秒

checkboxでイベントを確認する【javascript】
<script>
var strname = "mydata";//ストレージ名
var num = 55;//チェックボックス最大の値

function butotnClick(){
//num = 55;
data = "";
for(i=0;i<=num;i++)
{
if(data!="")
{
data += "@";
}
name01 = 'check'+String(i);
//alert(name01);
data += document.getElementById(name01).checked;
}
//alert(data);
localStorage.setItem(strname‚data);
//localStorage.setItem('mydata'‚ checkbox1.checked+"@"+checkbox2.checked);
}

//let checkbox1 = document.getElementById('check1');
//let checkbox2 = document.getElementById('check2');
//checkbox2.checked = true;

//alert(localStorage.getItem(strname));

if(localStorage.getItem(strname)) {

sptbl01 = localStorage.getItem(strname).split('@');
for(i=0;i<sptbl01.length;i++)
{
name01 = 'check'+String(i);
if(sptbl01[i]=="true")
{
document.getElementById(name01).checked =true;
}
}
}

//let checkButton = document.getElementById('checkButton');
//checkButton.addEventListener('click'‚ butotnClick);

//num = 55;
for(i=0;i<=num;i++)
{
name01 = 'check'+String(i);
//alert(name01);
cbox01 = document.getElementById(name01);
cbox01.addEventListener('click'‚ butotnClick);
}


</script>

【じんじん】
2024年12月11日
7時30分8秒

html
<TABLE>
<TBODY>
<TR>
<TD>発見者</TD>
<TD>石板</TD>
<TD>アイテム</TD>
<TD>適正</TD>
<TD> <input type="checkbox"id="check0"></TD>
</TR>
<TR>
<TD>ピリファ</TD>
<TD>【守護を得る旅】</TD>
<TD>【ひゃっかじてん】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check1"></TD>
</TR>
<TR>
<TD>リズニャ</TD>
<TD>【わるいトレイじゃないよ】</TD>
<TD>【スライムトレイ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check2"></TD>
</TR>
<TR>
<TD>ドラっち</TD>
<TD>【おばけ退治!】</TD>
<TD>【超うつくし草】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check3"></TD>
</TR>
<TR>
<TD>ヒサゴン</TD>
<TD>【幸運を求める冒険】</TD>
<TD>【ラッキーペンダント】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check4"></TD>
</TR>
<TR>
<TD>ミラン</TD>
<TD>【帰ってきたヒーロー】</TD>
<TD>【メタルキングのたて】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check5"></TD>
</TR>
<TR>
<TD>ベホミン</TD>
<TD>【死の宮殿】</TD>
<TD>【せいじゃくのたま】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check6"></TD>
</TR>
<TR>
<TD>コッコー</TD>
<TD>【空からの導き】</TD>
<TD>【あまぐものつえ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check7"></TD>
</TR>
<TR>
<TD>タワスラ</TD>
<TD>【スライム王者決定戦!?】</TD>
<TD>【スライムのかんむり】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check8"></TD>
</TR>
<TR>
<TD>ピラー</TD>
<TD>【強者への試練】</TD>
<TD>【せんしのあかし】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check9"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【冒険者たちのみちくさ】</TD>
<TD>【みずでっぽう】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check10"></TD>
</TR>
<TR>
<TD>ケダン</TD>
<TD>【証を授かりし者たち】</TD>
<TD>【そうりょの証】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check11"></TD>
</TR>
<TR>
<TD>ドララン</TD>
<TD>【わるいステッキじゃないよ】</TD>
<TD>【スライムステッキ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check12"></TD>
</TR>
<TR>
<TD>どくゾー</TD>
<TD>【亡霊たちのパーティ】</TD>
<TD>【くさった死体の心】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check13"></TD>
</TR>
<TR>
<TD>メターズ</TD>
<TD>【メタリックフェスティバル】</TD>
<TD>【げんまのカード】</TD>
<TD>【40】</TD>
<TD> <input type="checkbox"id="check14"></TD>
</TR>
<TR>
<TD>エビーヌ</TD>
<TD>【海原の支配者】</TD>
<TD>【デーモンスピア】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check15"></TD>
</TR>
<TR>
<TD>あまお</TD>
<TD>【プレゼントを取り返せ!】</TD>
<TD>【超おなべのフタ】</TD>
<TD>【25】</TD>
<TD> <input type="checkbox"id="check16"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【猛獣たちのみちくさ】</TD>
<TD>【メガザルのうでわ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check17"></TD>
</TR>
<TR>
<TD>マロン</TD>
<TD>【いわくつきの廃墟】</TD>
<TD>【みなごろしのけん】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check18"></TD>
</TR>
<TR>
<TD>かげお</TD>
<TD>【闇の洞くつ】</TD>
<TD>【女神の盾】</TD>
<TD>【35】</TD>
<TD> <input type="checkbox"id="check19"></TD>
</TR>
<TR>
<TD>クックー</TD>
<TD>【山頂に咲く花?】</TD>
<TD>【はんにゃのめん】</TD>
<TD>【25】</TD>
<TD> <input type="checkbox"id="check20"></TD>
</TR>
<TR>
<TD>ラクー</TD>
<TD>【海底の亡霊】</TD>
<TD>【かぜのマント】</TD>
<TD>【35】</TD>
<TD> <input type="checkbox"id="check21"></TD>
</TR>
<TR>
<TD>メトロン</TD>
<TD>【氷の竜がすむ洞くつ】</TD>
<TD>【やみのランプ】</TD>
<TD>【28】</TD>
<TD> <input type="checkbox"id="check22"></TD>
</TR>
<TR>
<TD>ギガンス</TD>
<TD>【力じまんたちの山】</TD>
<TD>【ミンクのコート】</TD>
<TD>【25】</TD>
<TD> <input type="checkbox"id="check23"></TD>
</TR>
<TR>
<TD>デッスー</TD>
<TD>【浅瀬のビーチ】</TD>
<TD>【真ふしぎなボレロ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check24"></TD>
</TR>
<TR>
<TD>いしにん</TD>
<TD>【操り人形師の館】</TD>
<TD>【メガザルのうでわ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check25"></TD>
</TR>
<TR>
<TD>ヘルット</TD>
<TD>【魔術師の塔】</TD>
<TD>【たいようのいし】</TD>
<TD>【35】</TD>
<TD> <input type="checkbox"id="check26"></TD>
</TR>
<TR>
<TD>キラちょ</TD>
<TD>【幻のまものたち】</TD>
<TD>【真ちからのたて】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check27"></TD>
</TR>
<TR>
<TD>ナイト</TD>
<TD>【星空のまものたち】</TD>
<TD>【きせきのつるぎ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check28"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【導かれしまものたち】</TD>
<TD>【いかずちのつえ】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check29"></TD>
</TR>
<TR>
<TD>リック</TD>
<TD>【古の竜がすむ洞くつ】</TD>
<TD>【超まもりのたね】</TD>
<TD>【22】</TD>
<TD> <input type="checkbox"id="check30"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【魔術師からのプレゼント】</TD>
<TD>【スライムのかんむり】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check31"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【狙われし森】</TD>
<TD>【おうじゃのマント】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check32"></TD>
</TR>
<TR>
<TD>ベル</TD>
<TD>【最強!?黒に染まる森】</TD>
<TD>【ローズバトラーの心】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check33"></TD>
</TR>
<TR>
<TD>もりばん</TD>
<TD>【番人がまもる森】</TD>
<TD>【超しもふり肉】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check34"></TD>
</TR>
<TR>
<TD>ベビタン</TD>
<TD>【天空のまものたち】</TD>
<TD>【女神の盾】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check35"></TD>
</TR>
<TR>
<TD>スーラン</TD>
<TD>【あやしい古城】</TD>
<TD>【たいようのかんむり】</TD>
<TD>【40】</TD>
<TD> <input type="checkbox"id="check36"></TD>
</TR>
<TR>
<TD>モグラン</TD>
<TD>【かわりものたちの山】</TD>
<TD>【にじのしずく】</TD>
<TD>【30】</TD>
<TD> <input type="checkbox"id="check37"></TD>
</TR>
<TR>
<TD>アクーデ</TD>
<TD>【大悪魔の住む塔】</TD>
<TD>【超ふしぎなきのみ】</TD>
<TD>【20】</TD>
<TD> <input type="checkbox"id="check38"></TD>
</TR>
<TR>
<TD>ぴこりん</TD>
<TD>【魔法使いのゆめ】</TD>
<TD>【真ふっかつの杖】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check39"></TD>
</TR>
<TR>
<TD>マッスー</TD>
<TD>【騎士たちの布陣】</TD>
<TD>【コスモファントム心】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check40"></TD>
</TR>
<TR>
<TD>いしにん</TD>
<TD>【まだ見ぬ試練の城】</TD>
<TD>【おうじゃのマント】</TD>
<TD>【60】</TD>
<TD> <input type="checkbox"id="check41"></TD>
</TR>
<TR>
<TD>メタッパ</TD>
<TD>【隠された財宝!?】</TD>
<TD>【ふっかつのつえ】</TD>
<TD>【30】</TD>
<TD> <input type="checkbox"id="check42"></TD>
</TR>
<TR>
<TD>ビップル</TD>
<TD>【優雅な?晩さん】</TD>
<TD>【超ちからのたね】</TD>
<TD>【20】</TD>
<TD> <input type="checkbox"id="check43"></TD>
</TR>
<TR>
<TD>レッド</TD>
<TD>【鋼鉄の太陽】</TD>
<TD>【真ふしぎなぼうし】</TD>
<TD>【60】</TD>
<TD> <input type="checkbox"id="check44"></TD>
</TR>
<TR>
<TD>ギズモン</TD>
<TD>【雲海の覇者】</TD>
<TD>【ルビスのまもり】</TD>
<TD>【20】</TD>
<TD> <input type="checkbox"id="check45"></TD>
</TR>
<TR>
<TD>ファラト</TD>
<TD>【行列のできる美容院】</TD>
<TD>【ふろしきマント】</TD>
<TD>【20】</TD>
<TD> <input type="checkbox"id="check46"></TD>
</TR>
<TR>
<TD>ドラピー</TD>
<TD>【竜のねぐら】</TD>
<TD>【ひかりのたて】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check47"></TD>
</TR>
<TR>
<TD>ダースン</TD>
<TD>【猛獣たちの森】</TD>
<TD>【せいれいのカード】</TD>
<TD>【35】</TD>
<TD> <input type="checkbox"id="check48"></TD>
</TR>
<TR>
<TD>さんぞく</TD>
<TD>【ドキドキのパーティ】</TD>
<TD>【てつなべ】</TD>
<TD>【18】</TD>
<TD> <input type="checkbox"id="check49"></TD>
</TR>
<TR>
<TD>カボこ</TD>
<TD>【腹ペコまつり】</TD>
<TD>【超かしこさのたね】</TD>
<TD>【18】</TD>
<TD> <input type="checkbox"id="check50"></TD>
</TR>
<TR>
<TD>プックル</TD>
<TD>【けものたちの洞窟】</TD>
<TD>【まきばの杖】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check51"></TD>
</TR>
<TR>
<TD>デスカー</TD>
<TD>【おたから争奪戦!】</TD>
<TD>【ヒーローベルト】</TD>
<TD>【30】</TD>
<TD> <input type="checkbox"id="check52"></TD>
</TR>
<TR>
<TD>アルージ</TD>
<TD>【けものたちの森】</TD>
<TD>【超ちからのたね】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check53"></TD>
</TR>
<TR>
<TD>エミリン</TD>
<TD>【強者への挑戦】</TD>
<TD>【カルベロビュート】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check54"></TD>
</TR>
<TR>
<TD>ナノファ</TD>
<TD>【ピコ族のすみか】</TD>
<TD>【フライパン】</TD>
<TD>【?】</TD>
<TD> <input type="checkbox"id="check55"></TD>
</TR>
</TBODY>
</TABLE>