Click事件偵聽器的動態/移動錨

我使用教程插件 - http://particlebits.com/code/jquery-tutorial/Click事件偵聽器的動態/移動錨

其中有連接到你需要的教程步驟數此代碼。

<div for="tutstep4" data-target="#publishbutton" data-arrow="tc" data-location="tr" style="display: block; "> 
     <h1>Almost Done!</h1> 
     <p> 
     Now click "Publish" and you are done. 
     </p> 
    </div>

我的問題是如何觸發附加到每個教程步驟的標籤的點擊事件。

<a id="tutorial-done" class="tutorial-button" href="javascript:void(0);" style="display: block; ">Done!</a> 
<a id="tutorial-cancel" class="tutorial-cancel" href="javascript:void(0);">X</a> 
<a id="tutorial-next" class="tutorial-button" type="button" href="javascript:void(0);" style="display: none; ">Next</a> 
<a id="tutorial-prev" class="tutorial-button" type="button" href="javascript:void(0);" style="display: block; ">Prev</a>

這些標籤和步驟之間移動使用相同的ID的，所以如果我打電話

$('.tutorial-button').click(function(){ 
do something 
})

按鈕已經被點擊的功能不註冊。

我不想編輯tutorial.js文件，因爲它在不同的頁面上使用。當'＃tutorial-prev'被點擊後，我能做些什麼來'聽'，然後根據它附加的div調用一個函數？

即，如果在教程步驟爲3時單擊了「＃tutorial-prev」，請執行某些操作？

UPDATE：

加強遠離它一會我發現一個更容易的解決方案，只需使用一隻猴子補丁的功能腳本中並添加其中包括開/我自己的個人代碼關閉所需的div後。

所以它像

$.fn.tutorialNext() { 
// start of original next code. 
//end of original code. 
myfunc(); 
}

不完全是漂亮，但對於一個頁面一個快速解決方案，我需要一些定製。

我最初面臨的問題是，當運行Next（）函數時，錨標記已經被移除，因此沒有執行該功能的元素。

來源

2012-03-22 Davekilg

我不知道我是否有明確你想什麼來實現的，但是當你有單擊處理：

$("'#tutorial-prev").on("click", dosomething);

在做一些事情，你可以複製你想要的單擊事件比比皆是：

$(selector).trigger("click");

來源

2012-03-22 23:06:14 gpasci

此外，這裏是'.on'和'.click'的一個很好的解釋。 http://stackoverflow.com/questions/9122078/difference-between-onclick-vs-click – 2014-11-21 13:14:52

與您發佈的js一樣，您使用tutorial-button類將click事件綁定到每個按鈕。

您可以通過使用元素的id進一步指定一個按鈕，爲此您需要將一個回調綁定到每個按鈕。

$('#tutorial-prev').click(function(){ //go to previous step }); 
$('#tutorial-next').click(function(){ //go to next step }); 
$('#tutorial-cancel').click(function(){ //cancel actions }); 
...

來源

2012-03-22 23:08:16 eltuza

UPDATE：

加強遠離它一段時間後，我發現一個更容易的解決方案，只需使用一隻猴子補丁的功能腳本中，並添加自己的個人代碼，由開啓/關閉所需的分區。

所以它像

$.fn.tutorialNext() { 
// start of original next code. 
//end of original code. 
myfunc(); 
}

不完全是漂亮，但對於一個頁面一個快速解決方案，我需要一些定製。

我最初面臨的問題是，當運行Next（）函數時，錨標記已經被移除，因此沒有執行該功能的元素。

來源

2012-04-02 21:45:32 Davekilg

Click事件偵聽器的動態/移動錨

回答

相關問題