Perlでメニュー更新マークを表示する方法

このQ&Aのポイント
  • Perlでメニューの更新マークを表示する方法についてまとめました。メニューを更新した際にNew!というマークを付けるため、チェックボックスを使用してナンバーを記録し、その番号に対応するメニューに更新マークを表示する方法を解説しています。
  • 具体的な手順としては、チェックボックスで選択した番号を管理し、連想配列を使用してメニューごとに更新マークの表示・非表示を管理します。選択された番号に対応するメニューに更新マークを表示するため、連想配列内の該当するインデックスに対してマークを付けます。
  • 連想配列を使用することでコードのシンプル化が可能であり、メニューの数が増えた場合でも柔軟に対応することができます。ただし、連想配列のインデックスとメニューの番号は一致している必要があります。また、連想配列のインデックスの初期値は空文字列として設定しておくことで、更新マークが非表示の状態で初期化されます。
回答を見る
  • ベストアンサー

希望した番号に更新マークを表示する

Perlで組んでいます。 メニューがあり、コンテンツを更新するとNew!とつけたいです。 1.お知らせ 2.ニュース 3.BLOG New! ・ ・ ・ 管理画面を作り、 チェックボックスをメニューの数作りチェックしたナンバーを カンマ区切りで記録するところまではOK。 たとえば、2,4,6など。 それを取り出して2番目、4番目、6番目のメニューにNew!マークを つけたいのですが、いい案が思いつきません。 いま途中ですが、参考程度に見てください。 かなり中途半端な作りになっています。 ↓↓ %menu = ("0" => "", "1" => "", "2" => "", "3" => "", "4" => "", "5" => "", "6" => "", "7" => "", "8" => "", "9" => ""); foreach $eachman (@txt) { (@menu) = (split(/,/, $eachman)); } #どの連想配列に更新マークをつけるか? if ( $menu == 0 ) { $span[0] = $sp; } elsif ( $menu == 1 ) { $span[1] = $sp; } elsif ( $menu == 2 ) { $span[2] = $sp; } elsif ( $menu == 3 ) { $span[3] = $sp; } elsif ( $menu == 4 ) { $span[4] = $sp; } elsif ( $menu == 5 ) { $span[5] = $sp; } elsif ( $menu == 6 ) { $span[6] = $sp; } elsif ( $menu == 7 ) { $span[7] = $sp; } elsif ( $menu == 8 ) { $span[8] = $sp; } #=メニュー画面抜粋== <p><A HREF=\"$home/myne/">1.お知らせ</A>$span[0]</p> <p><A HREF=\"$thisurl?>2.ニュース</A>$span[1]</p> <p><A HREF=\"$thisurl?mycmd=>3.blog</A>$span[2]</p> としています。連想配列を使ってシンプルに仕上げる方法 あるでしょうか?

  • CGI
  • 回答数3
  • ありがとう数3

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

  • ベストアンサー
  • danmarino
  • ベストアンサー率63% (26/41)
回答No.2

No.1です。すみません。微妙に間違えていたので再投稿させていただきます。 おそらく、データを記録するときに「2,4,6」とするよりも「0,1,0,1,0,1,0,0…」とした方が結果出力するときにやりやすいのではないかと思います。左からnewを付けたい場合に「1」付けたくない場合に「0」と順番にカンマ区切りで記録していきます。 その場合、 $itemmax = 9; #メニューの数 @menuname = ("メニュー1","メニュー2",…) @url = ("URL1","URL2",…) foreach $eachman (@txt) { @menu = (split(/,/, $eachman)); } for ($i=0;$i<9;$i++) { $ix = $i+1; if ($menu[$i]) { $w = "new!";} else { $w = "";} print qq(<p><A HREF="$url[$i]">$ix.$menuname[$i]</A>$w</p>); }

Scotty_99
質問者

お礼

おかげさまでできました。 1,0,0・・のように記録するのはやめて7,8,9で 記録し、foreachでまわし、合致するメニュー番号のみに New!マークがつくようにアレンジしました。 まだいろいろ改変したいのでそのときはぜひまた よろしくお願いします。

その他の回答 (2)

  • moon_night
  • ベストアンサー率32% (598/1831)
回答No.3

($mtime) = (stat($file))[9]; とすると$fileの更新時間を取ってくれるので、それで判定すると自動でやってくれるので面倒では無い気もします。 @file=('a.htm','b.htm'); $time = time; $i = 0; foreach(@file){ ($mtime) = (stat($file))[9]; $mtime += 60*60*24*1; # 更新時間の一日後 if($time < $mtime){ $span[$i] = 'New'; } とかすると自動でいい感じになるやもしれませぬ。 実運用だとデータをテキストで持って 0\お知らせ\tinfo.htm\tmynu/\n 1\tニュース\tnews.dat\tnews.cgi\n 2\tblog\tblog.dat\t./blog/\n とかして、 foreach $data (@data) { chomp($data); ($a,$b,$c,$d) = split(/\t/,$data); ($mtime) = (stat($c))[9] + 60*60*24*1; print qq|<p><A HREF="$d">$b</A>|; if($time < $mtime){ $span[$i] = 'New'; } print qq|</p>\n|; } とかやればメンテがしやすいと思います。

  • danmarino
  • ベストアンサー率63% (26/41)
回答No.1

おそらく、データを記録するときに「2,4,6」とするよりも「0,1,0,1,0,1,0,0…」とした方が結果出力するときにやりやすいのではないかと思います。 $itemmax = 9; #メニューの数 @menuname = ("","メニュー1","メニュー2",…) foreach $eachman (@txt) { @menu = (split(/,/, $eachman)); } for ($i=1;$i<=9;$i++) { if ($menu[$i]) { $w = "new!";} else { $w = "";} print qq(<p><A HREF="URL">$i.$menuname</A>$w</p>); }

関連するQ&A

  • ネスケとIEを同じ表示にしたい

    文字をborderで囲ったものを二列に6つずつ並べて、サイトのメニューとして 使っています。 HTMLを以下のように記し、↓ <div> <span class="menu"><a href="#">AAA</a></span> <span class="menu"><a href="#">BBB</a></span> …… </div> <div> <span class="menu"><a href="#">CCC</a></span> <span class="menu"><a href="#">DDD</a></span> …… </div> これをcssで以下のようにしているのですが、ネスケで上手く表示されません 。 .menu { font-size: 13px; text-align: center; margin: 2px; border:1px solid gray; width: 97px; height: 15px; color: #808080; } どうも、marginとwidth、heightが反映されていないようなのですが、これを ネスケでも反映させるにはどうしたらいいでしょうか。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • HPの電話番号表示について

    皆様よろしくお願いします。 HPに電話番号を記載し、その番号をタップすると電話がかかるようにする方法についてです。 文章部分のHTMLは・・・ <p><strong><span style="font-size: 18px;">青空市場&nbsp;</span></strong></p> <p>■住所:愛知県</p> <p><span style="font-size: 15px;">■TEL:000-0000-0000</span></p> となっています。 調べるとここに・・・ <a href="tel:000-0000-0000">TEL000-0000-0000</a> これをいれるみたいなのですが、どこにどんなふうに入れればいいのでしょうか? よろしくお願いいたします。

  • CSSでひとつだけdisplay:none;が適用されない

    メニューを画像にし、文字を見えなくするために display:none; を用いたのですが、一番上のメニューのみ適用されません。 #menu_1 a span{ display:none; } #menu_2 a span{ display:none; } ~~~~~~~~~~~~~~~ #menu_10 a span{ display:none; } としているのですが、 #menu_1のみが適用されません HTMLタグは <strong id="menu_1"><A href="#"><span>メニュー1</span></A></strong> <strong id="menu_2"><A href="#"><span>メニュー2</span></A></strong> <strong id="menu_3"><A href="#"><span>メニュー3</span></A></strong> <strong id="menu_4"><A href="#"><span>メニュー4</span></A></strong> <strong id="menu_5"><A href="#"><span>メニュー5</span></A></strong> ~~~~~~~~~~~~~~~ <strong id="menu_11"><A href="#"><span>メニュー10</span></A></strong> このようにしています。 一番上のメニューのみ画像の上に文字が重なるように表示されます。 うまくまとめることができませんでしたが、 どなたか宜しければ教えて頂けるとうれしいです。

    • ベストアンサー
    • CSS
  • スマートフォン用サイトのアコーディオンメニュー

    スマートフォン用サイトのアコーディオンメニューを作成しています。 http://html-five.jp/140/ こちらのサイト様の情報をもとに2段のメニューが作ろうと思ったのですが、 空白のページが表示されてしまいますが、どこを修正したらよいのかわかりません。 記述したものは下記のとおりです。 解答よろしくお願いいたします。 <head> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css"> <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script> </head> <body> <script type="text/javascript"> $(".accordion p").click(function(){ $(this).next("ul").slideToggle(); $(this).children("span").toggleClass("open"); }); </script> <div> <ul> <li> <p><span>LIST 6</span></p> <ul> <li> <p><span>LIST 6-1</span></p> <ul> <li><a href="page01.html">LIST 6-1-1</a></li> <li><a href="page01.html">LIST 6-1-2</a></li> <li><a href="page01.html">LIST 6-1-3</a></li> </ul> </li> <li> <p><span>LIST 6-2</span></p> <ul> <li><a href="page01.html">LIST 6-2-1</a></li> <li><a href="page01.html">LIST 6-2-2</a></li> <li><a href="page01.html">LIST 6-2-3</a></li> </ul> </li> <li> <a href="page01.html">LIST 6-3 (not to open)</a> </li> </ul> </li> <li> <p><span>LIST 7</span></p> <ul> <li> <p><span>LIST 7-1</span></p> <ul> <li><a href="page01.html">LIST 7-1-1</a></li> <li><a href="page01.html">LIST 7-1-2</a></li> <li><a href="page01.html">LIST 7-1-3</a></li> </ul> </li> <li> <p><span>LIST 7-2</span></p> <ul> <li><a href="page01.html">LIST 7-2-1</a></li> <li><a href="page01.html">LIST 7-2-2</a></li> <li><a href="page01.html">LIST 7-2-3</a></li> </ul> </li> <li> <p><span>LIST 7-3</span></p> <ul> <li><a href="page01.html">LIST 7-3-1</a></li> <li><a href="page01.html">LIST 7-3-2</a></li> <li><a href="page01.html">LIST 7-3-3</a></li> </ul> </li> </ul> </li> </ul> </div> </body>

  • タグを切り替えるJavaScriptについて

    下記のurlを参考にして、タグを切り替えるJavaScriptを使いレイアウトをしています。 http://archiva.jp/web/javascript/tab-menu.html やりたいことは各内容をIDセレクタでくくりたいのです。 <div id="page1">  <h2>page1</h2>  <p>パンクズ</p>  <div class="nav">   <ul id="tab">    <li><a href="#page1"><span>page1を選択中</span></a></li>    <li><a href="#page2"><span>page2</span></a></li>    <li><a href="#page3"><span>pave3</span></a></li>   </ul>  </div>  <p>段落1</p> </div> <div id="page2">  <h2>page2</h2>  <p>パンクズ</p>  <div class="nav">   <ul id="tab2">    <li><a href="#page1"><span>page1</span></a></li>    <li><a href="#page2"><span>page2を選択中</span></a></li>    <li><a href="#page3"><span>pave3</span></a></li>   </ul>  </div>  <p>段落1</p> </div> ...page3 このようにやりたいのですが、JavaScriptがIDセレクタの"tab"にしか対応していないため、他のページにいくとクリックが効かなくなってしまいます。 idセレクタをclassセレクタに設定し直してもidセレクタにしか対応していないため効きません。 tag2とtab3に対応させるためにはどのようにすればいいでしょうか。 よろしくお願いします。

  • jQueryアコーディオンで複数メニューを開きたい

    jQueryで開閉式(アコーディオン)の縦メニューを作りました。 http://www1.m.jcnnet.jp/minato01/demo/j-menu/ このメニューで、以下の2点の仕様を追加希望です。 1. 「メニュー1」「メニュー2」を最初から開いた状態で表示したい 2.できれば、ページ移動した場合、前の開いた内容を記憶させたい(cookieでOK) 特に「1」は必須事項です。 色々検索してみましたが、方法が色々あっても すべて満たす方法が見つかりません。 ソースは以下の通りです。 -------------------- html -------------------- <span>メニュー 1</span> <ul> <li><a href="#">メニュー 1-1</a></li> <li><a href="#">メニュー 1-2</a></li> <li><a href="#">メニュー 1-3</a></li> </ul> <span>メニュー 2</span> <ul> <li><a href="#">メニュー 2-1</a></li> <li><a href="#">メニュー 2-2</a></li> <li><a href="#">メニュー 2-3</a></li> </ul> <span>メニュー 3</span> <ul> <li><a href="#">メニュー 3-1</a></li> <li><a href="#">メニュー 3-2</a></li> <li><a href="#">メニュー 3-3</a></li> </ul> <span>メニュー 4</span> <ul> <li><a href="#">メニュー 4-1</a></li> <li><a href="#">メニュー 4-2</a></li> <li><a href="#">メニュー 4-3</a></li> </ul> -------------------- css -------------------- ul, li { text-indent: 0; list-style: none; } ul { display: none; } ul.selected { display: block; } span { margin-bottom:1px; padding: 8px 4px; display: block; cursor: pointer; border:1px solid #ccc; } span:before { padding: 0 8px 0 0; vertical-align: middle; content: url("img/bullet_arrow_right.png"); } span.selected:before { content: url("img/bullet_arrow_down.png"); } span:hover,li:hover { background: #f3f3f3; } -------------------- js -------------------- $(function() { $('<img>').attr('src', 'img/bullet_arrow_down.png'); $('span').click(function() { $(this).next('ul').slideToggle('fast'); $(this).toggleClass('selected'); }); }); ※jQueryは「jquery-1.9.0.min.js」を読み込んでいます。 -------------------- 参考サイトは以下のサイトです。 http://php.o0o0.jp/article/4138817358715040 分かる方、ぜひ具体的にどこをどう修正したらよいか 詳しく教えていただければ幸いです。 どうぞよろしくお願いいたします。

  • タグの中身だけを取り出す正規

    下記のような配列から、タグの中身だけを取り出す正規表現を教えてください。 $array = array(   '<span>山田 太郎</span>',   '<span><a href="http://www.example.com">ホームページ</a></span>', ); よろしくお願いします。

    • ベストアンサー
    • PHP
  • $a[x]と$a['x']

    連想配列の$a[x]と$a['x']の書式のどちらかにメリットはありますか?

    • ベストアンサー
    • PHP
  • タブメニューを上下に設置

    下記サイトを参考にタブメニューを作成しました。 http://5am.jp/jquery/jquery_ui_tabs/ こちらのタブを上下に配置し、selectされた状態も連動させたいと思っています。 スクリプトをどのように すればいいかお分かりの方がおられましたら ご教授頂けませんでしょうか。 <script type="text/javascript"> $(function() { $('#ui-tab > ul').tabs({ fx: { opacity: 'toggle', duration: 'normal' } }); }); </script> <div id="tabs"> <ul> <li><a href="#tab1"><span>タブ1</span></a></li> <li><a href="#tab2"><span>タブ2</span></a></li> <li><a href="#tab3"><span>タブ3</span></a></li> </ul> <div id="tab1"> <p>タブ1の内容</p> </div> <div id="tab2"> <p>タブ2の内容</p> </div> <div id="tab3"> <p>タブ3の内容</p> </div>       <ul class="bottom_tab"> <li><a href="#tab1"><span>タブ1</span></a></li> <li><a href="#tab2"><span>タブ2</span></a></li> <li><a href="#tab3"><span>タブ3</span></a></li> </ul> </div> どうぞ宜しくお願いいたします。

  • luxbarの表示について3

    Proof4さん回答ありがとうございます。お陰様で改善できました。 申し訳ないのですがあと数点教えてください。 1.luxbarの上部にヘッダー用のlogo画像等設置用のスペースの開けたいのですが可能でしょうか?試しに<br>でスペースを開けてみたのですが不可でした。もしもスペースが確保できた場合のスマホ用の大きさになった場合、ハンバーガーメニューは右上に表示しているのでしょうか? 2.配色を試しに#91D0CDで行ってみましたが色は変わりませんでした。 3.全てのメニューに多階層を設置したいのですが、メニュー一番初めの  <li class="luxbar-item active"><a href="#">Home</a></li>を  <li class="luxbar-item dropdown"><a href="#">Home</a></li> にすると問題があるのでしょうか? 4.https://okwave.jp/qa/q9621783.htmlにFlexboxのレシポンシブCSSで困って質問しています。かなりお詳しそうなので是非教えて頂けないでしょうか? 初心者なものですから多数質問して申し訳ないのですが宜しくお願い致します。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="https://cdn.rawgit.com/balzss/luxbar/ae5835e2/build/luxbar.min.css"> <style> <!-- .luxbar-navigation{ justify-content: flex-start; } .dropdown >ul{ display: none; } /******* カスタムの色設定 *******/ .luxbar-menu-custom, .luxbar-menu-custom .dropdown ul{ background-color: #91D0CD; /* 背景色 */ color: #fff; /* 文字色 */ } .luxbar-menu-custom .active, .luxbar-menu-custom .luxbar-item:hover{ background-color: #91D0CD; /* アクティブなメニューとhover時の色 */ } .luxbar-menu-custom .luxbar-hamburger span, .luxbar-menu-custom .luxbar-hamburger span::before, .luxbar-menu-custom .luxbar-hamburger span::after { background-color: #91D0CD; /* ハンバーガーメニューの色 */ } --> </style> </head> <body> <br> <br> <br> <br> <div class="luxbar luxbar-static"> <input type="checkbox" id="luxbar-checkbox" class="luxbar-checkbox"> <div class="luxbar-menu luxbar-menu-right luxbar-menu-dark"> <ul class="luxbar-navigation"> <li class="luxbar-header"> <a class="luxbar-brand" href="#">Brand</a> <label class="luxbar-hamburger luxbar-hamburger-doublespin" for="luxbar-checkbox"> <span></span> </label> </li> <li class="luxbar-item dropdown"><a href="#">Home</a> <ul> <li class="luxbar-item" ><a href="#">Max</a></li> <li class="luxbar-item" ><a href="#">Edgar</a></li> <li class="luxbar-item" ><a href="#">John</a></li> </ul> </li> <li class="luxbar-item dropdown"><a href="#">Users</a> <ul> <li class="luxbar-item" ><a href="#">Max</a></li> <li class="luxbar-item" ><a href="#">Edgar</a></li> <li class="luxbar-item" ><a href="#">John</a></li> </ul> </li> <li class="luxbar-item dropdown"><a href="#">HomeHome</a> <ul> <li class="luxbar-item" ><a href="#">MaxMaxMax</a></li> <li class="luxbar-item" ><a href="#">Edgar</a></li> <li class="luxbar-item" ><a href="#">JohnMax</a></li> </ul> </li> <li class="luxbar-item dropdown"><a href="#">HomeHomeHome</a> <ul> <li class="luxbar-item" ><a href="#">Max</a></li> <li class="luxbar-item" ><a href="#">EdgarMax</a></li> <li class="luxbar-item" ><a href="#">John</a></li> </ul> </li> </ul> </div> </div> </body> </html>

専門家に質問してみよう