2

サーバー上のテキスト ファイルから値 ("img1.jpg" など) を読み取り、div に追加してスライド ショーを作成しようとしています。

唯一の問題は、最初の「スライド」に.activeクラスを適用する必要があることです。

私のテキストファイルの読み方は次のとおりです。

ここに画像の説明を入力

追加したい div は次のようになります。

 <div class="carousel-inner">
   <!-- slide -->
     <div class="active item slide3 animated fadeInUpBig">
        <img src="img1.jpg" />
     </div>
   <!-- slide -->
     <div class="item slide3 animated fadeInUpBig">
        <img src="img2.jpg" />
     </div>                           
 </div>

これが私が試したことです：

$(function () {
var file = "gallery.txt"; // gallery.txt PATH

$('<div />'.load(file, function(data){ // dummy DIV to hold data 
    var line      = data.split('\n');
    var NofImages = line.length -1;        
    for( i=0; i < NofImages; i++ ){
        image = './cms/data/img/gallery/homepage/'+ line[i].split('|')[2];
        $(".carousel-inner").append("<div class='active item slide3 animated fadeInUpBig'><img src='+ image +' /></div>");
    }   
}

});
4

3 に答える 3

2 
$(function () {
    var file = "gallery.txt"; // gallery.txt PATH

    $('<div />').load(file, function(data){ // dummy DIV to hold data 
        var line      = data.split('\n'),
            NofImages = line.length -1,
            imageURL  = '';
        for( i=0; i < NofImages; i++ ){
            imageURL = './cms/data/img/gallery/homepage/'+ line[i].split('|')[2];
            $(".carousel-inner").append("<div class='item slide3 animated fadeInUpBig'><img src='"+ imageURL +"' /></div>");
        } 
        // NOW ADD THE .active TO FIRST ONE
        $('.carousel-inner').find('.item').eq(0).addClass('active');
    });
});

$ .ajax（）と$ .get（）および$ .load（）の違い

于 2013-01-10T16:43:28.297 に答える
1

これを試して：

$.get("gallery.txt").done(function(response) {
    var lines = response.split("\n");
    for (var i = 0; i < lines.length; i++) {
        var fragments = lines[i].split("|");
        var html = "<div class='item animated fadeInUpBig slide3'><img src='" + fragments[2] + "' /></div>";
        $(".carousel-inner").append(html);
    }

    $(".carousel-inner .item").eq(0).addClass("active");
});
于 2013-01-10T16:41:37.920 に答える
1

ゼロの場合はクラスを追加してください

var activeClass = i==0 ? "active " : "";
$(".carousel-inner").append("<div class='" + activeClass + "item...
于 2013-01-10T16:34:42.080 に答える