1

我希望使用 JQuery 在 ID 为“LogInsert”的 div 层插入 html（listItems），该 JQuery 访问包含键/值对数组的 cookie（LogSum）。数组 cookie 中的一些项目需要与插入的 html 结合到 DOM 中。

我有以下错误的函数脚本，它在各种事件中被调用：

      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 但我不知道为什么。有任何想法吗 ？

4

2 回答 2

1

在您的循环中，val将是一个字符串，而不是一个对象，但您将其视为一个对象。您必须在角色上拆分每个部分，然后val在角色上拆分每个部分，最后得到键和值。然后使用这些来构建您的 HTML 片段。&=

如果您使用调试器（在 2012 年没有理由不使用客户端调试器 :-)），这在检查时应该很清楚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-27T08:40:05.470 回答
1

您可以转换：

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, etc... 而值是avatar-male, Contributor, thedon, etc... 像这样：

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>";

演示

于 2012-07-27T08:46:29.753 回答