1. 程式人生 > >用jquery實現cookie的操作以及建立js陣列和遍歷js陣列,js物件,jquery.json的使用

用jquery實現cookie的操作以及建立js陣列和遍歷js陣列,js物件,jquery.json的使用

我為什麼把這些內容放在一個文章了說呢?因為在真實使用的時候一般都會設計到。在讀取cookei時肯定會有相應的其他操作。

用jquery實現對cookie的操作,這裡用到的是:jquery.cookie.js,一個輕量級的cookie 外掛,可以讀取、寫入、刪除 cookie。

頁面引入:(具體可以根據自己專案的情況引入必須的js就可以了)

<script type="text/javascript" src="../static/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../static/js/jquery.cookie.js"></script>
<script type="text/javascript" src="../static/js/jquery.json.min.js"></script>

下面我直接身上js程式碼,jsp程式碼暫時就不給了。

<script type="text/javascript">

-------建立js陣列的寫法,建立陣列的寫法有多種,還有陣列的初始化等,有需要細緻瞭解的自己再細緻的百度吧。new Array()

    var current = new Array();
--------一個普通的初始化方法,一個onclick事件
    $(function() {
        $("#addBut").click(
                function() {
                    var vevn = $("#env").val();
                    var venvurl = $("#envurl").val();

---------------建立js物件,Object()

                    var optionSel = new Object();

-------------給js物件新增屬性並賦值,直接物件.屬性高

                   optionSel.text = vevn;
                    optionSel.value = venvurl;

------------將js物件新增到js陣列中去:陣列.push(物件)

                   current.push(optionSel);
------------向html末尾追加html
                    $("#selecturl").append(
                            "<option selected='selected' value='"+venvurl+"'>"
                                    + vevn + "</option>");
-------------設定cookie,cookie的資料形式是key-value型別的,所以可以通過key得到value,$.cookie('options')獲得key值options的value
                    if ($.cookie('options')!=null) {
                        var optStr = $.cookie("options");

--------------字串的json再js中可以使用:JSON.parse(json字串),也可以使用eval()函式

                        var optArr = JSON.parse(optStr);
 ------------js遍歷陣列        $.each(陣列, function(i, 陣列中的物件) { });               
                        $.each(optArr, function(i, obj) {
                            var optionSel = new Object();
                            optionSel.text = obj.text;
                            optionSel.value = obj.value;
                            current.push(optionSel);
                        });
                        //optArr.putsh(optionSel);

-------------將JSON陣列變為字串$.toJSON(陣列)

                       var newjson = $.toJSON(current);

-------------------cookie是可以設定有效期的,expires : 365表示的是36天有效

                       $.cookie("options", newjson, {
                            expires : 36
                        });
                    } else {
                        var optjson = $.toJSON(current);
                        $.cookie('options', optjson, {
                            expires : 36
                        });
                    }

                });
    })
</script>