JSON.parse syntax errors in Chrome and IE

i'm trying to use the jquery cookie plugin to effectively 'remember' the position of a scrollpane created by the jscrollpane plugin.

basically i want jscrollpane to look at the cookie and set the initial horiztonal position based on the saved value. and then on change of position, update the cookie.

i started out w/ arrays, but am now using objects. the key is the div #id, which i coded to reflect the category of posts it is displaying... this way it will be unique. the key's value is the horizontal position that jscrollpane kicks out.

i thought it would work best to turn the object i want to store as a cookie into a JSON string, but when i try to convert it back into an object using JSON.parse(cookie) i get syntax errors in IE and Chrome.

jQuery(function($){

    //load the cookie 
    var cookie = $.cookie('xpos');
    //Load the saved values or a new array if null.

    var xpositions = cookie ? JSON.parse(cookie) : new Object();

    console.log(xpositions);


    // Loop over each scroll-pane
    $( ".scroll-pane" ).each( function( index ){
        $(this).jScrollPane({showArrows: true, autoReinitialise: true}); //initialize jscrollpane
        var api = $(this).data('jsp'); //access jscrollpane api 

        //var catID = parseInt($(this).attr('id').match(/[0-9]+/)); //grab cat_ID which we've stored as part of the div id#
        var catID = $(this).attr('id');

        if( typeof xpositions[catID] != "undefined" ) {
            console.log(catID +" = element exists in array and position = " + xpositions[catID] );
            api.scrollToX(xpositions[catID]); //set scroll-pane position to position saved in cookie
        } 

        $(this).bind('jsp-scroll-x',function(event, scrollPositionX){   //change cookie on scroll event     
            xpositions[catID] = scrollPositionX;
            console.log(catID + " = " + scrollPositionX);

            //set the cookie with array of x-positions, expires after 7 days
            $.cookie('xpos', JSON.stringify(xpositions), { expires: 7, path: '/' });

            }
        );

    }); //end each


});

you can check out the live version here: http://www.testtrack.tv/

edit: i should also mention that this seems to work on my local XAMPP server,开发者_运维问答 but still fails live. thanks!

edit: why is it that posting on SO seems to point me in a better direction? i have since found the jookie plugin to just flat out WORK where the cookie plugin was failing w/ my object.

http://joncom.be/code/jquery-jookie/

my new code is this:

// initialise a cookie that lives for 1 week
$.Jookie.Initialise("xposition", 60*24*7);

// Loop over each scroll-pane
$( ".scroll-pane" ).each( function( index ){
    $(this).jScrollPane({showArrows: true, autoReinitialise: true}); //initialize jscrollpane
    var api = $(this).data('jsp'); //access jscrollpane api 

    var catID = $(this).attr('id');

    var xpos = $.Jookie.Get("xposition", catID);
    if(xpos) {
        api.scrollToX(xpos); //set scroll-pane position to position saved in cookie
    }


    $(this).bind('jsp-scroll-x',function(event, scrollPositionX){   //change cookie on scroll event     
        // set a value to the cookie
        $.Jookie.Set("xposition", catID, scrollPositionX);
        }
    );

}); //end each

---

xpos=%7B%22cat-45%22%3A0%2C%22cat-48%22%3Anull%7D Is what you set as my cookie when I visited your page; a JSON parser isn't going to be able to parse that. You want it to be xpos={..object stuff here..}.

Essentially, if you can't copy the string into a variable manually, the parser will have trouble.

---

Have you try to do an eval ?

if (cookie !== null) {
    var jsoncookie = eval("("+cookie +")"); // $.parseJSON(cookie );
}