0
<div class="slider">
    <div class="slide">
         ..//
    </div>

    <div class="slide">
         ..//
    </div>

    <div class="slide">
         ..//
    </div>

    <ul class="pagination">
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
    </ul>
</div>

javascript/jqueryliでの数と同じ数を作りたいslide

私はこれを試しましたが、うまくいかないようです

var pagination = $('.pagination li a').size();
var slides = $('.slide').size();

$(function(){
 pagination=slides;
});

これは私の本当の質問です。複数のスライダーがある場合div class="slider"、ページ内のすべてのスライドではなく、div内のリンクの数をスライド内のスライドと等しくするにはどうすればよいですか

言い換えれば、入力したhtmlがあり、このような別の構造を持っている場合div class="slide"、ページネーションのリンクをthos divの数と等しくするにはどうすればよいですか

4

4 に答える 4

1

s で使用each()し、 ( class を使用して)divを呼び出しappend()て、それぞれに 1 つ追加できます。ulpaginationlidiv

$(".pagination").empty();
$('.slide').each(function(_, value){
    $(".pagination").append('<li><a href="#"></a></li>');
});

すべての s を削除し、 s の数だけlis を追加します。lidiv

フィドル


この他のソリューションは、違いに対してのみ機能します。

divs よりもsが多い場合はli、一致するために必要な数が追加されます。

一方、lis よりもdivs が多い場合。li数が等しくなるまで最後の s を削除します。

var pagination = $('.pagination li a').size();
var slides = $('.slide').size();

if (slides > pagination) {
    for(var i = pagination; i < slides; i++) {
        $(".pagination").append('<li><a href="#"></a></li>');
    }
}
else {
     for(var i = slides; i < pagination; i++) {
        $(".pagination li:last-child").remove();
    }
}

フィドル

于 2013-05-12T21:06:00.263 に答える
0

あなたが達成したいことを私が理解していれば。必要なコードがあります:

$(function(){
var pagination = $('.pagination li'),
    slides = $('.slider > .slide');
if (slides.size() > pagination.size()){
    var diff = slides.size() - pagination.size();
    for (var numero=1; numero<=diff; numero++){
        $('.pagination li:last').after('<li><a href="#"></a></li>')
    }
}

});

実際の例: http://jsfiddle.net/CUXTW/1/

于 2013-05-12T21:14:39.390 に答える