

ご教授お願いします。何をどう書けばいいですか？  
したいことは、  
1,cookie一覧をページに表示し、  
cookieがまだ何も保存されていなかった場合にはメッセージを表示したいです。  
(例："まだ保存されていません"のような)  
2,最新順が一番上に表示されるようにしたいです、

現状はまだ保存されてない場合は真っ白な画面になってます

下記は登録画面でボタンが押されたら表示する処理のlist.htmlです

[code]

    <!DOCTYPE html>
    <html lang="ja"><head>
    <script src="/js/jquery.cookie.js" charset="euc-jp"></script>
    <script type="text/javascript" charset="utf-8">
    $(function() { 
       $(document).ready( function(){
       var ss = $.cookie('favorite');` 
        if (!(ss == true )) {
          $('#list').text('何もクリックされていません');
        } else if (ss = $.cookie('favorite')){
          ss = JSON.parse(ss);
          for (var i = 0; i < fa.length; i++) {
            ss[i] = ss[i].substring(ss[i].lastIndexOf('_0') + 2, ss[i].length);
            var d = ss[i].split('_');
            $('#list').append($('<img src="' + d[1] + '">''));
          };
        }
      });
    
    </script>
    </head>
    <body class="index" >
    <div id="list">
    
    </div>
    </body>
    </html>
    
[/code]

下記は基本になる登録image.htmlです

[code]

    <!doctype html>
    <html lang="ja">
    <script>
        $(function () {
            $(document).ready( function(){
            });
    
            $('img[src="/images/btn_favorite.png"]').click(function () {
    
                var index = $('img[src="/images/btn_favorite.png"]').index(this);
                var h2 = $('div.box_text:eq(' + index + ')').children('h2');
                var img = $('div.box_main:eq(' + index + ')').find('img');
                var src_para = $(this).closest('a').attr('href');
    
                $.cookie.json = true;
                var data = $(h2).text() + '_' + './' + img.attr('src');
                if ($.cookie('favorite') == null) {
                    var p = [];
                    p.push(data);
                    $.cookie('favorite', JSON.stringify(p), {'expires':7, 'path': '/'});
                }
                else {
                    var ss = JSON.parse($.cookie('favorite'));
                    console.log(ss);
                    if (ss.indexOf(data) == -1) {
                        ss.push(data);
                    }
                    $.cookie('favorite', JSON.stringify(fa), {'expires':7, 'path': '/'});
    
                }
            });
        });
    </script>
    </head>
    <body>
    
    <div class="box_main">
    <div class="photo"><a href=""><img src="images/A.jpg" ></a></div>
    <div class="box_text">
    <h2>表品A</h2>
    </div></div>
    <table width="100%">
    <tbody>
    <tr>
    <td width="50%">
    <a href="" class="etc_link"><img src="/images/btn_favorite.png"></a>
    </td>
    </tr>
    </tbody>
    </table>
    
    
    <div class="box_main">
    <div class="photo"><a href=""><img src="images/B.jpg" ></a></div>
    <div class="box_text">
    <h2> 商品B</h2>
    </div></div>
    <table width="100%">
    <tbody>
    <tr>
    <td width="50%">
    <a href="" class="etc_link"><img src="/images/btn_favorite.png"></a>
    </td>
    </tr>
    </tbody>
    </table>
    
    
    <div class="box_main">
    <div class="photo"><a href=""><img src="images/C.jpg"></a></div>
    <div class="box_text">
    <h2> 商品C</h2>
    </div></div>
    <table width="100%">
    <tbody>
    <tr>
    <td width="50%">
    <a href="" class="etc_link"><img src="/images/btn_favorite.png"></a>
    </td>
    </tr>
    </tbody>
    </table>
    </html>
    
[/code]


CC BY-SA 3.0
2015-10-15T14:04:49.387
17687
2016-03-15T18:09:59.217
2015-10-17T15:24:37.283
9013
9013
question
javascript jquery cookie
Using the javascript , jquery cookie


jQueryでクッキー(Cookie)を扱う場合は、jQuery Cookie pluginを導入します。

こちらの記事が参考となるでしょう。  
[jQueryプラグイン「jquery.cookie.js」でcookieを簡単に扱う](http://www.tam-
tam.co.jp/tipsnote/javascript/post3109.html)

なお、本来やりたいこととは、2番目のソースにある内容を実施したいのでしょうか。それとも１番目の内容と２番目の内容を同時に行いたいのでしょうか。

$(document).ready(... で呼び出されるのは１つだけです。複数の $(document).ready( は実行されません。

ですので、想像するに、やりたいことは以下でしょうか。

[code]

    <script type="text/javascript" charset="utf-8">
    $(function() { 
      $(document).ready( function(){
        var ss = $.cookie('favorite');
        if ( ss === undefined ) {
          $('#list').text('まだ何も保存されていません');
        } else { 
          fa = JSON.parse(ss);
          for (var i = 0; i < ss.length; i++) {
            ss[i] = ss[i].substring(ss[i].lastIndexOf('_0') + 2, ss[i].length);
            var d = ss[i].split('_');
            $('#list').append($('<img src="' + d[1] + '">'));
          };
        }
      });
    });
    </script>
    
[/code]


CC BY-SA 3.0
2015-10-15T15:34:11.623
17693
2015-10-16T05:00:28.237
2015-10-16T05:00:28.237
5778
5778
17687
answer