Question

我正在尝试将多个类从JSON文件添加到我在同一个函数中使用Jquery创建的HTML元素。问题是这些课程都没有进入低谷。一些JSON数据部分（项）具有多个类，它们在数组中设置。创建HTML部分并获取dat.location但它没有获得任何类。我认为我在插入课程时有些不对劲但不确定是什么。

如何在函数中将类插入txtp变量？

function CreateContent(data) {
    for (var i = 0; i < data.length; i++) {
        var dat = data[i];
        var txtp = $('<p class="column" href="#">' + dat.location + '</p>');
        $(txtp).addClass(dat.items1);
        $(txtp).addClass(dat.items2);
        $(txtp).addClass(dat.items3);
        $(".positionInHtml").append(txtp); 
    }
}

这是JSON数据文件包含的内容，您简化/更改了此问题的变量名称。

{
  "Places": [
    {
      "location": "Name1",
      "items1": [ "1A" ],
      "items2": [ "1B","11B" ],
      "items3": [ "1C" ]
    },
    {
      "location": "Name2",
      "items1": [ "2A" ],
      "items2": [ "2B" ],
      "items3": [ "2C","22C" ]
    }
}

Answer 1

您的问题是因为您每次使用时都会从txtp创建新的jQuery对象，因此不会保留任何更改。

要解决此问题，请创建一次对象，然后根据需要修改/追加它：

function CreateContent(data) {
  for (var i = 0; i < data.length; i++) {
    var dat = data[i];
    var $txtp = $('<p class="column" href="#">' + dat.location + '</p>').appendTo('.positionInHtml');
    $txtp.addClass(dat.items1);
    $txtp.addClass(dat.items2);
    $txtp.addClass(dat.items3);
  }
}

Answer 2

试试这个

function CreateContent(data) {
    for (var i = 0; i < data.length; i++) {
        var dat = data[i];
        var classes = dat.items1+' '+dat.items2+' '+dat.items3;
        var txtp = $('<p class="column "'+classes+' href="#">' + dat.location + '</p>');
        $(".positionInHtml").append(txtp); 
    }
}

Answer 3

问题似乎是在JSON文件中使用数组来存储类，然后尝试使用Jquery .addClass插入它，在这种情况下，它不会将值提供给目标txtp。一旦我删除了数组[＆＃34; A1＆＃34;，＆＃34; A2＆＃34;]并将它们用字符串＆＃34; A1 A2＆＃34;它按预期工作，类被赋予txtp。

将类添加到Jquery HTML变量

3 个答案: