• ベストアンサー

ソート フォーム

以前こちらで質問させていただいたものです。 ソートのできるリストについて質問し、大変ためになる回答をい忠美案した。今回、それを少々変更する必要があります。 ソートすべきリストの中にフォーム要素のチェックボックスを入れたいのですが、ソートするとチェックが消えてしまいます。 下記のようなコードですが、どのように修正すればよいでしょうか? どうかよろしくお願いいたします! <html> <head><style>span{border:1px solid;margin:4px}</style></head> <body> <ol> <li> <span><a href="#" onClick="narabi(this,0)">社名</a></span> <span><a href="#" onClick="narabi(this,1)">仕入値</a></span> <span><a href="#" onClick="narabi(this,2)">小売値</a></span> <span><a href="#" onClick="narabi(this,3)">会社ID</a></span> <span>備考(ソート不要)</span> </li> </ol> <ul> <li><span>ABC</span><span ><input type="checkbox"></span><span >200</span><span >1</span><span >テキスト(ソート不要)</span></li> <li><span>BBB</span><span ><input type="checkbox"></span><span >300</span><span >2</span><span >テキスト(ソート不要)</span></li> <li><span>XYZ</span><span ><input type="checkbox"></span><span >300</span><span >3</span><span ></span></li> <li><span>A-AA</span><span ><input type="checkbox"></span><span >120</span><span >4</span><span >テキスト(ソート不要)</span></li> <li><span>A-17</span><span ><input type="checkbox"></span><span >200</span><span >5</span><span >テキスト(ソート不要)</span></li> </ul> </body> <script> var af=[]; function narabi(ob,cidx){ af[cidx]=af[cidx]?0:1; var dt=[]; var tg=parentSearch(ob,'OL').nextSibling; var li=tg.getElementsByTagName('li'); for(var i=0,m=li.length;i<m;i++){ var sp = li[i].getElementsByTagName('span'); dt[i]=sp[cidx].innerHTML+'|'; for(var j=0;j<4;j++) dt[i]+=sp[j].innerHTML+'|'; } dt.sort();if(af[cidx]) dt.reverse(); for(var i=0,m=dt.length;i<m;i++){ var sp = dt[i].split('|'); for(var j=0;j<4;j++) li[i].getElementsByTagName('span')[j].innerHTML=sp[j+1]; } } function parentSearch(o,t){while(o.tagName!=t)o=o.parentNode;return o;} </script> </html>

  • vld
  • お礼率100% (9/9)

質問者が選んだベストアンサー

  • ベストアンサー
noname#84373
noname#84373
回答No.2

私がそのとき答えたみたいですね^^; checkboxにIDをふりました。 ソートする前にバックアップして ソートしてから戻してます なんだか美しくありませんね;_; Firefoxでも動くようにちょっと直しました?! <html> <head><style>span{border:1px solid;margin:4px}</style></head> <body> <ol> <li> <span><a href="#" onClick="narabi(this,0)">社名</a></span> <span><a href="#" onClick="narabi(this,1)">仕入値</a></span> <span><a href="#" onClick="narabi(this,2)">小売値</a></span> <span><a href="#" onClick="narabi(this,3)">会社ID</a></span> <span>備考(ソート不要)</span> </li> </ol> <ul> <li><span>ABC</span><span ><input type="checkbox" id="c1"></span><span >200</span><span >1</span><span >テキスト(ソート不要)</span></li> <li><span>BBB</span><span ><input type="checkbox" id="c2"></span><span >300</span><span >2</span><span >テキスト(ソート不要)</span></li> <li><span>XYZ</span><span ><input type="checkbox" id="c3"></span><span >300</span><span >3</span><span ></span></li> <li><span>A-AA</span><span ><input type="checkbox" id="c4"></span><span >120</span><span >4</span><span >テキスト(ソート不要)</span></li> <li><span>A-17</span><span ><input type="checkbox" id="c5"></span><span >200</span><span >5</span><span >テキスト(ソート不要)</span></li> </ul> </body> <script> var af=[]; function narabi(ob,cidx){ af[cidx]=af[cidx]?0:1; var dt=[]; var tg=parentSearch(ob,'OL').nextSibling; while(tg.nodeName=='#text') tg=tg.nextSibling; var li=tg.getElementsByTagName('li'); var ch=tg.getElementsByTagName('input'); var t; var chkbx =[]; for(i=0;i<ch.length;i++)if(t=ch[i].id.match(/^c(\d+)$/)) chkbx[t[1]]=ch[i].checked; for(var i=0,m=li.length;i<m;i++){ var sp = li[i].getElementsByTagName('span'); dt[i]=sp[cidx].innerHTML+'|'; for(var j=0;j<4;j++) dt[i]+=sp[j].innerHTML+'|'; } dt.sort();if(af[cidx]) dt.reverse(); for(var i=0,m=dt.length;i<m;i++){ var sp = dt[i].split('|'); for(var j=0;j<4;j++) li[i].getElementsByTagName('span')[j].innerHTML=sp[j+1]; } for(var i in chkbx)document.getElementById('c'+i).checked = chkbx[i]; } function parentSearch(o,t){while(o.tagName!=t)o=o.parentNode;return o;} </script> </html>

vld
質問者

お礼

前回に引き続き、ありがとうございます! 問題なく動きました。 ありがとうございました!

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

ご質問のスクリプトは、各liタグの内容をひっくるめて文字列に変換し、ソートしてから、また元に戻すという処理を行っています。 具体的には (1)dt[i]=sp[cidx].innerHTML+'|';  で、キーとなる項目をまず先頭に入れてから(ソートが先頭の値で判断されるため) (2)for(var j=0;j<4;j++) dt[i]+=sp[j].innerHTML+'|';  で、li全体を一つの文字列にしています。(区切り文字は「|」) 全体を(dt[]を)ソートした後に (3)var sp = dt[i].split('|');  で、区切り文字によって分解してから (4)for(var j=0;j<4;j++) li[i].getElementsByTagName('span')[j].innerHTML=sp[j+1];  で、HTMLに戻しています。 ・・・なので、各チェックボックスのオンオフをチェックして、(2)のdt[i]に付け加え、ソート後に(3)で得られた値の内容に応じてチェックボックスのオンオフを再設定してあげればよいのではないでしょうか。

vld
質問者

お礼

おっしゃるとおり、流れは読んでわかるのですが、書き方が悪いのかどうもうまくいきませんでした。 コメントありがとうございます。

関連するQ&A

  • javascript バブルソート

    javascriptでバブルソートの実装をしています。 リストにある数値を取得して昇順 or 降順したいのですがうまくいきません。 方法を教えていただけないでしょうか。 よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <script type="text/javascript"> function bubbleSort(){ var liVal = document.getElementsByTagName("li"); var array = []; for(var i = 0; i < liVal.length; i++){ for(var j = 0; j < liVal.length-i-1; j++){ array[j] = parseInt(liVal[j].innerHTML); if(array[j] > array[j+1]){ var n = array[j]; array[j] = array[j+1]; array[j+1] = n; } } } } </script> </head> <body> <ul> <li>10</li> <li>5</li> <li>48</li> <li>22</li> <li>679</li> </ul> <p><a href="javascript:void(0);" onclick="bubbleSort()">ソート(降順)</a></p> </body> </html>

  • .innerHTMLの不一致?

    こんにちは。 Javascriptは全くの初心者です。 よろしくお願いします。 <div id="test"> <ul> <li><a href="a.html"><span>AAA</span></a></li> <li><a href="b.html"><span>BBB</span></a></li> <li><a href="c.html"><span>CCC</span></a></li> </ul> </div> <script type="text/javascript"> <!-- var data = "AAA";// AAAは自動取得させる予定 var nodes = document.getElementById('test').getElementsByTagName("a"); for (i = 0; i < nodes.length; i++) { if(nodes[i].innerHTML == data){ nodes[i].setAttribute("class","ddd"); } } //--> </script> 上記のようなjavascriptを設置し、 <li><a href="a.html"><span>AAA</span></a></li> の<a>にclass="ddd"を適用させようと思います。 (<span>には適用させたくない。) しかし、 var data = "AAA"; だと<a>の.innerHTMLは<span>AAA</span>なので <span>AAA</span> ≠ AAA で一致しません。 そこで、 var data = "<span>AAA</span>"; としたところ、FirefoxとNNでは成功しましたが、それ以外のブラウザでは駄目でした。 初心者でお恥ずかしい限りですが、 どうしたらよいのかご教授いただければ幸いです。 よろしくお願いします。

  • 隣接セレクタの適用範囲について。

    http://9-bb.com/css%E3%81%A0%E3%81%91%E3%81%A7%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%81%8C%E9%96%8B%E3%81%84%E3%81%9F%E3%82%8A%E9%96%89%E3%81%98%E3%81%9F%E3%82%8A%E3%81%99%E3%82%8B%E3%82%A2%E3%82%B3%E3%83%BC/ 上記のサイトを参考に、CSSで開閉式のリストを作りました。 そのサイトのHTMLの1行目~10行目は下記の様になっています。 <div class="menu"> <label for="Panel1">ボタン1</label> <input type="checkbox" id="Panel1" class="on-off" /> <ul> <li><a href="">リンク1</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> </ul> それに対応したCSSは、下記の様になっています。 input[type="checkbox"].on-off + ul{ height: 0; overflow: hidden; } input[type="checkbox"].on-off:checked + ul{ height: 200px; } つまり、 <input type="checkbox" id="Panel1" class="on-off" /> の後ろの <ul>タグに働きかける構造になっています。 それを改良して、<ul>タグの部分だけでなく、幅広い範囲に働きかける構造にしたいです。 そこで、対応しているCSSの隣接セレクタ「+」の後ろの「ul」を「span」にして、HTMLも「span」タグで括りました。 input[type="checkbox"].on-off + span{ height: 0; overflow: hidden; } input[type="checkbox"].on-off:checked + span{ height: 200px; } <div class="menu"> <label for="Panel1">ボタン1</label> <input type="checkbox" id="Panel1" class="on-off" /> <span> <ul> <li><a href="">リンク1</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> <li><a href="">リンク</a></li> </ul> </span> しかし、上手く動作しません。 要するに、「ボタン1」で開閉できる範囲を「リスト1」だけでなく「リスト1」「リスト2」の両方に効かせたり、「ul」タグに囲まれた範囲だけでなく、他のタグも含めた範囲にも効かせたいです。 要点を得ない質問になりましたが、アドバイスをお願いします。

    • 締切済み
    • CSS
  • DOM sort list table

    リストをソートしたいのですが... 下記のような<li>のchildNodesである<span>の内容でソートしたいのですが、どうすればいいでしょうか? <table><td>でソートするのと同じなのですが、テーブルに変換せずに、リストのままソートさせたいのです。 <ul>が下の<ol>の見出しとなっており、例えば「社名」を1回クリックすると降順、もう一度クリックすると昇順のようにしたいのです。(ulとolに分ける必要は特にありません) spanの下にclassを指定してもOKです。 DOMのrows[ ]やcells[ ]が使えないので困ってしまいました。どなたかお知恵をお願いいたします。 <ol> <li><span>社名</span><span>仕入値</span><span>小売値</span><span>会社ID</span><span>備考(ソート不要)</span> </li> </ol> <ul> <li><span>ABC</span><span >100</span><span >200</span><span >1</span><span >テキスト(ソート不要)</span></li> <li><span>BBB</span><span ></span><span >300</span><span >2</span><span >テキスト(ソート不要)</span></li> <li><span>XYZ</span><span >300</span><span >300</span><span >3</span><span ></span></li> <li><span>A-AA</span><span >100</span><span >120</span><span >4</span><span >テキスト(ソート不要)</span></li> <li><span>A-17</span><span >150</span><span >200</span><span >5</span><span >テキスト(ソート不要)</span></li> </ul>

  • メールフォームについて質問です。

    php初心者です。 メールフォームのチェックボックスの値をPOSTでキャッチしたあと表示がしたいのですがうまくいきません。 他のPOSTでキャッチした値も、最終的にforeachで回しています。 チェックボックスからの値のみ「array」と出力されます。 多次元配列の値を並列に表示したい場合、どのような処理の考え方があるのか教えていただきたいです。 送信元 <form action="entry.php" method="post"> <dl> <dt>氏名 <span class="red">[必須]</span></dt> <dd><input type="text" name="氏名"></dd> </dl> <dl> <dt>フリガナ <span class="red">[必須]</span></dt> <dd><input type="text" name="フリガナ"></dd> </dl> <dl> <dt>メールアドレス <span class="red">[必須]</span></dt> <dd><input type="text" name="メールアドレス" style="white-space:nowrap;"></dd> </dl> <dl> <dt>参加内容</dt> <dd><input type="checkbox" value="値1" name="参加内容[]">値1</dd> <dd><input type="checkbox" value="値2" name="参加内容[]">値2</dd> </dl> <dl> <dt>個人情報保護方針 <span class="red">[必須]</span><br /><input type="checkbox" class="checkbox" name="個人情報保護方針">同意する</dd> </dl> <p class="contactBt"><input type="submit" value="確認ページ" /></p> </form> 【送信先】 $_POSTSTRINGCODE = "EUC-JP"; $_THISFILESTRING = "UTF-8"; $_MYPOST = ""; foreach($_POST as $key=>$var) { //mb_convert_variables($_THISFILESTRING, $_POSTSTRINGCODE, $key); //smb_convert_variables($_THISFILESTRING, $_POSTSTRINGCODE, $var); $_MYPOST[$key] = $var; } <dl> <?php unset( $_MYPOST['個人情報保護方針'] ); foreach($_MYPOST as $key=>$var) { $key = strtr($key, $string_from, $string_to); if(get_magic_quotes_gpc()) $var = stripslashes($var); $var = htmlspecialchars($var); $OUT_var = ($var == "")?'&nbsp;&nbsp;':nl2br($var); print("<dt>".$key."</dt><dd>".$OUT_var."</dd>"); ?> <INPUT type="hidden" name="<?php echo $key ?>" value="<?php echo $var ?>"> <?php print("</dt></dd>\n"); } ?> </dl> 配列はこんな感じです。 array(6) { ["所属団体"]=> string(1) "a" ["氏名"]=> string(2) "aa" ["フリガナ"]=> string(3) "ア" ["メールアドレス"]=> string(15) "aaa@aaa.co.jp" ["ご参加内容"]=> array(2) { [0]=> string(51) "値1" [1]=> string(15) "値2" } ["個人情報保護方針"]=> string(2) "on" } このまま表示させると「array」として表示されてしまうため「値1」「値2」の値を表示 させるためループ内で色々やってみましたが、考え方自体少しつかめていません。   【現状】 所属団体 a 氏名 aa フリガナ ア メールアドレス aaa@aaa.co.jp ご参加内容 Array (この場所に「値1」「値2」が表示させるようにしたいです) どなたかご教授いただければと思います。 よろしくおねがいいたします。

    • ベストアンサー
    • PHP
  • Javascriptでプルダウンメニューを作りましたが関数化できません

    <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> function foldmenu(i){ var i; for(j=1;j<=5;j++){ if(i==j) $('#sc'+j).toggle('normal'); else $('#sc'+j).hide(); } $(function(i){ $('#c'+i).click(function(){ for(j=1;j<=5;j++){ if(i==j) $('#sc'+j).toggle('normal'); else $('#sc'+j).hide(); } }); }); } </script> <div id="c1" onClick="foldmenu('1')">1</div> <ul id="sc1"> <li><a href="#">入力画面1-1</a></li> <li><a href="#">入力画面1-1</a></li> </ul> <div id="c2" onClick="foldmenu('2')">2</div> <ul id="sc2"> <li><a href="#">入力画面2-1</a></li> <li><a href="#">入力画面2-2</a></li> </ul> <div id="c3" onClick="foldmenu('3')">3</div> <ul id="sc3"> <li><a href="#">入力画面3-1</a></li> <li><a href="#">入力画面3-2</a></li> </ul> <div id="c4" onClick="foldmenu('4')">4</div> <ul id="sc4"> <li><a href="#">入力画面4-1</a></li> <li><a href="#">入力画面4-2</a></li> </ul> <div id="c5" onClick="foldmenu('5')">5</div> <ul id="sc5"> <li><a href="#">入力画面5-1</a></li> <li><a href="#">入力画面5-2</a></li> </ul> と関数化しましたがうまく動きません。 初期状態では1の部分が開く。 それ以降はクリックした部分が開き開いていた部分は閉じるという感じにしたいです。 縦長のプルダウンメニューです。 たてに1から5が並んでいて、1をクリックすると1と2の間に1の子カテゴリーが表示されます。 困っています。教えてください。

  • 複数の要素へ appendchild できません

    以下のような html があり、それぞれの画像リンクの後ろに <span>文章4</span>を追加したいのですが、できません。 元の html <ol> <li>文章1 <a href="a.jpg" ><img src="a_small.jpg" /></a></li> <li>文章2 <a href="b.jpg"><img src="b_small.jpg" /></a></li> </ol> <p>文章3 <a href="c.jpg"><img src="c_small.jpg" /></a></p> 作りたい html <ol> <li>文章1 <a href="a.jpg" ><img src="a_small.jpg" /></a><span>文章4</span></li> <li>文章2 <a href="b.jpg"><img src="b_small.jpg" /></a><span>文章4</span></li> </ol> <p>文章3 <a href="c.jpg"><img src="c_small.jpg" /></a><span>文章4</span></p> 以下のようなスクリプトを書いてみたのですが、どうしても最後の要素(この場合は3番目の画像)へしか <span>文章4</span> が追加されません。全ての a タグの要素へ追加するにはどうしたらいいのでしょうか。 window.onload = function() { var addedSpan = document.createElement("span"); var addedTxt = document.createTextNode("文章4"); addedSpan.appendChild(addedTxt); var imgs = document.getElementsByTagName ("a"); for (var i=0; i<imgs.length; i++) { imgs[i].appendChild (addedSpan); } } 初歩的な質問でお恥ずかしいのですが、是非ご教授ください。どうぞよろしくお願いします。

  • フォームの制御について

    下記2つのJavaScriptについて正しい記述方法について、 どうすれば良いかを模索しています。 アドバイスを頂ければ幸いです。 どうぞ何卒よろしくお願い致します。 1.チェックボックスの値とテキストフォームの値を結合する方法 <!-- C02の中から選択されているものを取得// --> for ( var i = 0; i < checkbox02.length; i ++ ) { if ( checkbox02[i].checked === true ) { text += checkbox02[i] + text01. value; text += '\n';}} 2.テキストエリアの値がNullの時に値が出力されないようにする方法 <!-- textarea01の中から選択されているものを取得// --> text += '回答3:' + textarea01 + '\n'; ソース: ----------------------------------------------------------------------------------------- <head> <title>アンケートフォーム</title> <script type="text/javascript">  <!-- 値の加工用// --> function textoutput() { <!-- フォームを変数に// --> var formObj = document.form01; <!-- checkbox01を取得// --> var checkbox01 = formObj.C01; <!-- checkbox02を取得// --> var checkbox02 = formObj.C02; <!-- text01.valueを取得// --> var text01 = formObj.text01.value; <!-- textarea01.valueを取得// --> var textarea01 = formObj.textarea01.value; <!-- textを結合用の変数として準備// --> <!-- チェックボックスの中から選択されているものを取得// --> var text = 'アンケート結果' + '\n'; <!-- C01の中から選択されているものを取得// --> for ( var i = 0; i < checkbox01.length; i ++ ) { if ( checkbox01[i].checked === true ) { text += checkbox01[i]. value; text += '\n';}} <!-- C02の中から選択されているものを取得// --> for ( var i = 0; i < checkbox02.length; i ++ ) { if ( checkbox02[i].checked === true ) { text += checkbox02[i] + text01. value; text += '\n';}} <!-- textarea01の中から選択されているものを取得// --> text += '回答3:' + textarea01 + '\n'; <!-- output.valueにtextを反映(最後に改行コード)// formObj.output.value = text + '\n'; } </script> </head> <body> <strong>アンケートフォーム</strong><br /><br /> <form name="form01"> <!--チェックボックスC01// --> <strong>・回答結果</strong><br /> <table border="0" > <td colspan="2" valign="middle"width="560"> <input type="checkbox" name="C01" value=" →回答1" id="checkbox 1-1" > <label for="checkbox 1-1">回答1</label> <input type="checkbox" name="C01" value=" →回答2" id="checkbox 1-2" > <label for="checkbox 1-2">回答2</label> </td> <tr> <!--チェックボックスC02// --> <td width="86" valign="middle"> <input type="checkbox" name="C02" value=" →その他:" id="checkbox 1-1" > <label for="checkbox 1-1">その他:</label> </td> <td valign="middle"> <input type="text "name="text01" size="60" /><br> </td> </table> <strong>・回答3:</strong><br /> <textarea name="textarea01" cols="60" rows="1" " tabindex="1" STYLE="ime-mode:active"></textarea><br> <!--結果出力// --> 結果出力<br> <input type="button" value="ログ出力" onClick="textoutput();"> <input type="reset" value="リセット" onclick="return confirm('リセットボタンがクリックされました。本当に入力内容を削除してもよろしいですか?');" /><br> <input type="button" name="Copy" value="クリップボードにコピー" onClick="CopyText('output');"><br> <textarea name="output" id="output" cols="60" rows="10"></textarea><br> </form> </body> </html>

  • チェックの入れ方によってリンク先を変える

    お世話になります。 チェックの入れ方によってリンク先を変える方法ですが、 他の回答者様がすでに回答れていまして、解決しているのですが、質問はチェックボックスが3つという想定ですが、4つあるとして、表記している組み合わせ以外の場合は同じページに飛ばすことはできますでしょうか?元の回答は下記です。わかる方がいたらお願いいたします。 <html> <head> <title>さんぷる</title> <style type="text/css"> #checklist{ list-style-type:none; margin:0;padding:0; } #checklist li{ margin:0;padding:0; } </style> <script type="text/javascript"> function jump1(){ var clist = document.getElementById('checklist').getElementsByTagName('input'); var URLlist = new Array(); URLlist['100'] = '1.html'; URLlist['010'] = '2.html'; URLlist['001'] = '3.html'; URLlist['110'] = '12.html'; URLlist['101'] = '13.html'; URLlist['011'] = '23.html'; URLlist['111'] = '111.html'; var condition=''; for(var i=0;i<clist.length;i++) { condition += (clist[i].checked)?'1':'0'; } if(condition == '000') { alert('チェックが一つもありません'); return; } //alert(URLlist[condition]);return; //テスト用 location.href=URLlist[condition]; } function jump2(){ var clist = document.getElementById('checklist').getElementsByTagName('input'); var condition=''; for(var i=0;i<clist.length;i++) { condition += (clist[i].checked)?i+1:''; } if(condition == '') { alert('チェックが一つもありません'); return; } //alert(condition+'.html');return; //テスト用 location.href=condition+'.html'; } </script> </head> <body> <ul id="checklist"> <li><input type="checkbox" id="cb01"><label for="cb01">項目1</label></li> <li><input type="checkbox" id="cb02"><label for="cb02">項目2</label></li> <li><input type="checkbox" id="cb03"><label for="cb03">項目3</label></li> </ul> <p><input type="button" value="ボタン" onclick="jump1()"></p> </body> </html>

  • cookieでcheckbox項目の追加と削除とソート表示

    http://www.din.or.jp/~hagi3/JavaScript/JSTips/Std/tbl.htm を参考に下記のようにcheckboxを付け加えました。 <script type="text/javascript"><!-- function tblfilter(nm,key){ if(!document.getElementsByTagName) return; var trs = document.getElementById(nm).rows; for(var i=0; i<trs.length; i++){ var li = trs[i]; if(!li.title || li.title=='') continue; var found=0; if(key == '') found=1; else { var keys = li.title.split(','); for(var j=0; j<keys.length; j++){ if(keys[j] == key){ found=1; break; } } } li.style.display = found?'':'none'; } } // --></script> </HEAD> <BODY> <FORM onsubmit="return false;"> <SELECT onchange="tblfilter('ex1',this.options[this.selectedIndex].value);"> <OPTION value="" selected>すべて</OPTION> <OPTION value=海>海の動物</OPTION> <OPTION value=陸>陸の動物</OPTION> <OPTION value=お気に入り>お気に入り</OPTION> </SELECT></FORM> <TABLE id=ex1> <TR title=海><TD><input type=checkbox value=1 title='追加'>1</TD><TD>いか</TD></TR> <TR title=陸,鳴く><TD><input type=checkbox value=2 title='追加'>2</TD><TD>いぬ</TD></TR> <TR title=海,鳴く><TD><input type=checkbox value=6 title='追加'>6</TD><TD>とど</TD></TR> </TABLE> </BODY></HTML> そして http://mugi.cc/js/030520.htm 上記のURLのようにcheckしたのをJavaScriptで保存し、 最終的にはselectからお気に入りを選んだ際、 checkしたものだけ表示するようにしたいと考えております。 お手数ですが、どなた様かご教授願いますようお願い致します。

専門家に質問してみよう