重新啓動功能使用jQuery

點擊動作，我有一些功能是這個樣子：重新啓動功能使用jQuery

var live_search_list = $('.live_search_list ul'), 
    active_search_element = live_search_list.find('li.active'), 
    search_element = live_search_list.find('li'), 
    jsPane = $('.jspPane'); 

$('.bottom_search').click(function(){ 
    if (!search_element.last().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element.next('li').addClass('active'); 
     jsPane.animate({top:"-=95px"}); 
    } 
}); 
$('.top_search').click(function(){ 
    if (!search_element.first().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element.prev('li').addClass('active'); 
     jsPane.animate({top:"+=95px"}); 
    } 
});

所以，問題開始第一次點擊之後，我只有一個動作 - 這個動畫。第一次點擊功能後，不再檢查我的情況，並且不會更改，刪除類active。每次點擊這個按鈕後我怎樣才能重新啓動這個功能？

來源

2013-01-14 Lukas

你想['停止（）']（http://api.jquery.com/停止/）動畫？ – epascarello

我想在每次點擊後檢查我的情況，現在在第一次點擊一切正常後，但在它之後我只有動畫動作... – Lukas

您確定'search_element'和'active_search_element'是第二次和以後的有效元素點擊？ +1對於epascarello所說的 - 除了任何東西 - 在再次開始動畫之前停止（）總是個好主意，否則，如果用戶在短時間內點擊幾次，你的動畫就會排隊等候，一切都會變得很詭異。 – WTK

後進行下一次li活動類，你需要重新緩存的active_search_element

var live_search_list = $('.live_search_list ul'), 
    active_search_element = live_search_list.find('li.active'), 
    search_element = live_search_list.find('li'), 
    jsPane = $('.jspPane'); 

$('.bottom_search').click(function(){ 
    if (!search_element.last().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element.next('li').addClass('active'); 
     active_search_element = live_search_list.find('li.active') 
     jsPane.animate({top:"-=95px"}); 
    } 
}); 
$('.top_search').click(function(){ 
    if (!search_element.first().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element.prev('li').addClass('active'); 
     active_search_element = live_search_list.find('li.active') 
     jsPane.animate({top:"+=95px"}); 
    } 
});

來源

2013-01-14 14:02:44

ofcourse，現在積極的類追加到第二個元素，並永遠留在它，很多thx的幫助，BR – Lukas

您並未將active_search_element設置爲新的活動元素！

線：

active_search_element = live_search_list.find('li.active')

僅選擇在該時刻的元件，它不會奇蹟般地保持更新。

$('.bottom_search').click(function(){ 
    if (!search_element.last().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element = active_search_element.next('li').addClass('active'); 
     jsPane.animate({top:"-=95px"}); 
    } 
}); 

$('.top_search').click(function(){ 
    if (!search_element.first().hasClass('active')) { 
     active_search_element.removeClass('active'); 
     active_search_element = active_search_element.prev('li').addClass('active'); 
     jsPane.animate({top:"+=95px"}); 
    } 
});

來源

2013-01-14 14:02:33 epascarello

它適用於，thx，我認爲這也是更靈活的方式來寫它 – Lukas

重新啓動功能使用jQuery

回答

相關問題