邏輯錯誤

Question

在這種jfiddle

http://jsfiddle.net/ezanker/fRb9L/2/

當「三」，而觀看標籤＃會以正確的方式標籤＃3

滑動點擊但是當我點擊在觀看水龍頭＃3時「同一」，它仍會沿相同的方向滑動。我想讓它向相反的方向滑動。

問題來自這部分？

if (!$(href).is(":visible")) 
{ 
     var dirclass = reverse == true ? " reverse" : ""; 

或者這部分代碼？

$(this).removeClass(trans + " in" + dirclass); 

此源代碼的哪部分必須改變才能解決該問題？感謝堆棧溢出

Answer 1

您的reverse變量無助於確定在點擊過程中應選擇哪個方向。

您應該比較之前選擇的元素和您選擇的元素。基於href串

比較它看起來像：

Fiddle。

$(".tabBtn").on("click", function(){ 
    var selectedHref = $('.ui-btn-active').prop("href"); 
    selectedHref = selectedHref.substr(selectedHref.lastIndexOf("#")); 
    $(".tabBtn").removeClass("ui-btn-active"); 
    $(this).addClass("ui-btn-active"); 
    var trans = $(this).data("transition"); 
    var href = $(this).prop("href"); 
    href = href.substr(href.lastIndexOf("#")); 
    if (!$(href).is(":visible")){ 
     var dirclass = href < selectedHref ? " reverse" : ""; 
     ... 

基於HTML結構：

Fiddle。

$(".tabBtn").on("click", function(){ 
    var selected = $('.ui-btn-active'); 
    $(".tabBtn").removeClass("ui-btn-active"); 
    $(this).addClass("ui-btn-active"); 
    var trans = $(this).data("transition"); 
    var href = $(this).prop("href"); 
    href = href.substr(href.lastIndexOf("#")); 
    if (!$(href).is(":visible")){ 
     var dirclass = $(this).parent().nextAll().find(selected).length ? " reverse" : ""; 
     ...