JQuery cookie使用數組中的項目來插入HTML列表項目？

我正在尋找插入html（listItems）在ID層爲「LogInsert」使用JQuery訪問包含鍵/值對數組的cookie（LogSum）的div層。數組cookie中的一些項目需要與插入的HTML組合到DOM中。JQuery cookie使用數組中的項目來插入HTML列表項目？

我有以下功能腳本錯誤，這就是所謂的各種事件：

 function SetLogSum() { 
     var listItems = ""; 
     var Cooksplit = $.cookie('logSum').split(','); 

     $.each(Cooksplit, function(key, val) { 
     listItems += "<div class='loggedinDetail'>" + 
     "<div class='loggedinImage'>" + 
     "<img src=" + val.uPic + " alt=" + val.uFName + val.uLName + " /></div>" + 
     "<div class='loggedinName'><span>" + val.uFName + "</span></div>" + 
     "<div class='loggedinStatus'><span>" + val.uGroup + " • " + val.uContRev + "</span></div>" + 
     "</div>" + 
     "<div class='loggedinHistory'>" + 
     "<div class='loggedinReviewCount' title='Reviews'><span>" + val.CntRev + " Reviews</span></div>" + 
     "<div class='loggedinTripCount' title=''><span>" + val.CntBook + "</span></div>" + 
     "</div>"; 
    } 
    ); 
    $("#LogInsert").html(listItems); 
    }

的logSum的cookie保存的信息，如：

uPic=avatar-male&uContRev=Contributor&uName=thedon&uGroup=Admin&uOP=0&uOA=0&uOH=0&uOI=0&uV=1&uP=0&uRv=0&uF=0&uCb=1&uPEC=0&uS=0&uC=UK&uL=en-US&uFName=Martin&uLName=Sansone&CntRev=6&CntBook=2

我知道listItems中的部分作品和.html插入，因爲我經常在AJAX調用中使用相同的結構。所以我的問題是我如何處理cookie，但我不知道爲什麼。有任何想法嗎？

來源

2012-07-27 Martin Sansone - MiOEE

您正在將逗號分割爲逗號，但您向我們顯示的Cookie文本包含零逗號？ – 2012-07-27 08:38:13

@AndersHolmström：我相信，根據代碼，這是* cookie中的一個*值，而不是整個cookie。 – 2012-07-27 08:38:58

是的，你們都是非常有幫助的......我已經清醒得太久了，而且大腦褪色了。謝謝你的回覆。 – 2012-07-27 09:10:45

你可以轉換：

valueStr = "uPic=avatar-male&uContRev=Contributor&uName=thedon&uGroup=Admin&uOP=0&uOA=0&uOH=0&uOI=0&uV=1&uP=0&uRv=0&uF=0&uCb=1&uPEC=0&uS=0&uC=UK&uL=en-US&uFName=Martin&uLName=Sansone&CntRev=6&CntBook=2"

字符串對象，其中鍵是uPic，uContRev，uName，等...和值avatar-male，Contributor，thedon，等等......像這樣：

var val = JSON.parse('{"'+ 
          valueStr.replace(/=/g,'":"') 
          .replace(/&/g,'","') + 
         '"}');

那麼這樣做：

listItems += "<div class='loggedinDetail'>" + 
    "<div class='loggedinImage'>" + 
    "<img src=" + val.uPic + " alt=" + val.uFName + val.uLName + " /></div>" + 
    "<div class='loggedinName'><span>" + val.uFName + "</span></div>" + 
    "<div class='loggedinStatus'><span>" + val.uGroup + " • " + val.uContRev + "</span></div>" + 
    "</div>" + 
    "<div class='loggedinHistory'>" + 
    "<div class='loggedinReviewCount' title='Reviews'><span>" + val.CntRev + " Reviews</span></div>" + 
    "<div class='loggedinTripCount' title=''><span>" + val.CntBook + "</span></div>" + 
    "</div>";

DEMO

來源

2012-07-27 08:46:29 Engineer

謝謝工程師，這個解決方案適合我所有的其他JSON AJAX，並感謝您指出我需要解析cookie字符串。 cookie最初是從服務器端使用JSON生成的！乾淨整潔，像夢一樣工作。 – 2012-07-27 09:16:03

在你的循環中，val將是一個字符串，而不是一個對象，但是你將它視爲一個對象。你必須分割&字符上的每個val，然後每個那些個字符的=字符，結尾是關鍵字和值。然後使用這些來構建您的HTML片段。

如果您使用調試器（2012年沒有使用客戶端調試器，則爲no excuse :-)），在檢查val時應該很清楚。

這裏有一個如何可能看起來草圖，既不調試也沒有保證，但它應該讓你去正確的方式：

$.each(Cooksplit, function(key, valStr) { 
    var items = valStr.split("&"), 
     val = {}; 

    // Build up an object in `val` using the keys and 
    // values from this entry 
    $.each(items, function(index, item) { 
     var parts = item.split("="); 
     val[parts[0]] = parts[1]; 
    }); 

    // ...use `val` as you were... 
    listItems += /* ... */; 
});

有我使用內循環，以建立一個對象val使用字符串中的鍵和值，因此您的HTML片段構建代碼可以在很大程度上保持不變。

來源

2012-07-27 08:40:05

謝謝T.J.我有Firebug開放，沒有任何藉口... :) – 2012-07-27 09:12:20

JQuery cookie使用數組中的項目來插入HTML列表項目？

回答

相關問題