Question

对不好的头衔抱歉，但无论如何。我有一个jQuery脚本，它从位于服务器上的PHP文件中检索数据。该脚本称为 fetch / debatt.js ，并在http://pi.codele.se/debatt.html上的一个<div class="classy">打印所有数据，但我希望每个输出的DIV上最多五个不同的类（一个输出á条目。）

1st DIV tag = class="first"
2nd DIV tag =  class="secondDiv"
3rd DIV tag = class="niels"
4th DIV tag = class="hotdog"
5th DIV tag = class="last"

取/ fetch.js

$(document).ready(function(){
    var output = $('#output');
    $.ajax({
        url: 'http://pi.codele.se/php/debatt.php',
        dataType: 'jsonp',
        jsonp: 'jsoncallback',
        timeout: 5000,
        success: function(data, status){
            $.each(data, function(i,item){ 
                var content = '<div class="classy"><div class="img-cont img-4" style="background-image: url('+item.bild+');"></div><h3>'+item.rubrik+'<span>Publicerad '+ item.datum+'</span></h3>'
                + '<p>'+item.innehall+'<br></div></div>';       
                output.append(content);
            });
        },
        error: function(){
            output.text('Kolla din anslutning.')
        }
    });
});

Answer 1

您可以使用数组：

var arr = ['first', 'secondDiv', 'niels', 'hotdog', 'last'];

$.each(data, function(i, item){ 
     var content = '<div class="' + arr[i] + '">...';
     // ...
});

Answer 2

你可以试试这个。这些类在一个数组中，每个类都以i为键，并从数组中输出相应的类。

$(document).ready(function(){
    var classes = ['class','class2','class3','class4','class5'];
    var output = $('#output');
    $.ajax({
        url: 'http://pi.codele.se/php/debatt.php',
        dataType: 'jsonp',
        jsonp: 'jsoncallback',
        timeout: 5000,
        success: function(data, status){
            $.each(data, function(i,item){ 
                var content = '<div class="'+classes[i]+'"><div class="img-cont img-4" style="background-image: url('+item.bild+');"></div><h3>'+item.rubrik+'<span>Publicerad '+ item.datum+'</span></h3>'
                + '<p>'+item.innehall+'<br></div></div>';       
                output.append(content);
            });
        },
        error: function(){
            output.text('Kolla din anslutning.')
        }
    });
});

按DIV的数量更改DIV级别

2 个答案: