如何製作彈出使用教程？

Question

我想顯示第一次用戶如何使用我的網站。我決定爲此使用popovers。所以，我創建了一些元素，如：

<li><a href="/rss/{{ user_id }}" id="help-rss" rel="popover" data-title="RSS feed" data-placement="bottom" data-trigger="manual" data-content="Use your favourite RSS reader to get our news!<br><br><a href='#' id='help-next-rss'>Next</a>">RSS</a></li> 

而像下面的代碼顯示popovers一個接一個：

$('#help-movie').popover('show'); 

$("#help-next-movie").click(function() { 
    $('#help-movie').popover('hide'); 
    $('#help-subscribe').popover('show'); 
}); 
$("#help-next-subscribe").click(function() { 
    $('#help-subscribe').popover('hide'); 
    $('#help-rss').popover('show'); 
}); 

但正確它不工作 - 首先顯示酥料餅（help-movie ），然後按Next，下一個顯示（help-subscribe）;但在此之後Next按鈕不起作用，help-rss未顯示。但是，如果我先顯示help-subscribe，則Next按鈕將起作用，並顯示help-rss。可能是什麼原因？

Answer 1

我認爲，如果元素的id隱藏，當你調用。點擊它不會工作，一旦所示，您需要使用jQuery的。對http://api.jquery.com/on/

所以儘量用。對替換您。單擊像這樣：

$('body').on("click", "#help-next-subscribe", function(event){ 
    $('#help-subscribe').popover('hide'); 
    $('#help-rss').popover('show'); 
}); 

。對基本上告訴瀏覽器監聽這些元素讓你的jQuery將仍然在這些因素作用，如果他們突然出現在頁面（如顯示，創建或通過Ajax請求拉入。