为每个JSON结果，添加CSS与类jquery

我想添加一个颜色来过滤选项在我的网上商店。颜色代码得到保存，现在我通过json返回它们。我想要做的是将颜色代码添加到输入上方的父类。我发现如何更改类名（我需要其他原因），但现在我必须添加颜色代码，以便json将它们返回顶部，底部。为每个JSON结果，添加CSS与类jquery

这是我走到这一步：

function onDataReceived(data) { 
     for (var i = 0; i < data.colorInfo.length; i++) { 
      console.log(data.colorInfo[i].colorCode); 
     } 

     $('input[id^="filter_"]').each(function(){ 
      $(this).parent().attr('class','addedClass'); 
      $(this).parent().parent().attr('class','addedClass'); 
     }); 
    } 

    $(document).ready(function() { 

      var url = 'myjsonlink.json'; 
      $.get(url, onDataReceived); 

    });

用的console.log行（data.colorInfo [I] .colorCode）;结果在我需要#fff等3种颜色代码有没有办法插入每个结果上面我有3种输入类型？

什么，我想实现的是：

<div style="background-color: data.colorInfo[i].colorCode"> <input> </div>

类似的东西

来源

2016-05-12 Nick Audenaerde

如果您需要为元素添加新的类名称，请使用.addClass（“newClassname”）而不是将其视为属性。 –

我的代码当前取代了现有的类，这就是我的意思。 –

function onDataReceived(data) { 
    //for (var i = 0; i < data.colorInfo.length; i++) { 
    // console.log(data.colorInfo[i].colorCode); 
    //} 
    var len = data.colorInfo.length; 

    $('input[id^="filter_"]').each(function(i){ 
     $(this).parent().addClass('addedClass');//attr('class','addedClass'); 
     $(this).parent().parent().addClass('addedClass') 
       .css('background-color',"'" + data.colorInfo[i % len].colorCode + "'"); 
//.attr('class','addedClass'); 
    }); 
}

来源

2016-05-12 16:09:04

我觉得我的做法是从DOM元素的类名来获取字符串：

var classString = $(this).parent().attr('class','addedClass');

然后将其分开并循环：

var newClasses = []; //initalize the new classes array 
var classes = classString.split(/ /); 
for(var a=0; a<classes.length; a++){ 
    var colorObj = data.colorInfo[a]; //get the relevant color object 
    if(colorObj){ 
     newClasses.push(classes[a] + '-' + colorObj.colorCode); // 
    } 
}

然后与新创建的替换旧的类：

$(this).parent().attr('class', newClasses.join(' '));

类似的东西。您可能首先要测试它;）

来源

2016-05-12 13:57:31

为每个JSON结果，添加CSS与类jquery

回答

相关问题