DRYコードのヘルプJavaScriptを修正しますか？

Question

私は基本的なjqueryスライダーを作っていましたが、私は基本的に2回繰り返しました。唯一の違いは、var prevとprevメソッドです。そして最後の方法に最初の方法。

left.on('click', function(){ 
    var current = $('.active'); 
    var prev = current.prev(); 
    if (prev.length === 0){ 
    prev = $(".slides").last(); 
    } 

    current.fadeOut(300).removeClass("active"); 
    prev.fadeIn(300).addClass("active"); 
}); 

right.on('click', function(){ 
var current = $('.active'); 
var next = current.next(); 
if (next.length === 0){ 
    next = $(".slides").first(); 
} 
current.fadeOut(300).removeClass("active"); 
next.fadeIn(300).addClass('active'); 
}); 

私はこの機能を試しましたが、機能しません。私は初心者ですので、この種の機能が可能かどうかはわかりません。

right.on('click', function(){ 
    slider("next", "first"); 
}); 

へ

function slider(x, y){ 
var current = $('.active'); 
var x = current.x(); 
if (x.length === 0){ 
    x = $(".slides").y(); 
} 
current.fadeOut(300).removeClass("active"); 
x.fadeIn(300).addClass('active'); 
}); 
right.on('click', slider("next", "first")); 
left.on('click', slider("prev", "last")); 

Answer 1

変更right.on('click', slider("next", "first"))それが動作するかどうかを参照してください。

Answer 2

関数内の一部の動的値にアクセスしようとしています。そうするときは、ブラケットの表記[]を使用する必要があります。つまり、current.xと$(".slides").y()は動作しません。何を行うことができますすることはcurrent[x]と

function slider(x, y){ 
var current = $('.active'); 
var slides = current[x](); 
if (slides.length === 0){ 
    x = $(".slides")[y](); 
} 
current.fadeOut(300).removeClass("active"); 
slides.fadeIn(300).addClass('active'); 
}); 

また、あなたのイベント処理を使用すると、エラーが発生します関数呼び出しを登録するクリックで間違っている$(".slides")[y]()このような括弧でそれらをacccessです。 {（） `関数スライダ（X、Y）{return関数：あなたが代わりに

right.on('click', slider.bind(null, "next", "first")); 
left.on('click', slider.bind(null, "prev", "last"));