2012-03-22 2 views
0

Я использую учебник плагин - http://particlebits.com/code/jquery-tutorial/Нажмите прослушиватель события для динамических/двигающихся якорей

, который имеет этот код, прикрепленный к числу шагов опекунских вам требуется.

<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> 

Мой вопрос в том, как я могу вызвать событие click из тегов, прикрепленных к каждому этапу обучения.

<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> 

Эти теги перемещаются между этапами с теми же идентификаторами, так что если я называю

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

кнопка уже нажата, и функция не зарегистрирует.

Я не хочу редактировать файл tutorial.js, поскольку он используется на разных страницах. Есть ли что-то, что я могу сделать, чтобы «прослушать», когда щелкнули «# tutorial-prev», а затем вызвали функцию на основе div, к которой она привязана?

i.e. Если щелкнуть '# tutorial-prev', когда шаг учебника будет 3, сделайте что-нибудь?

UPDATE:

После отступив от него на некоторое время я нашел простое решение, что просто использовать разводной патч на функции в сценарии и добавить свой личный код, который состоит из открытия/закрытия требуемого DIV ,

Так это было как

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

Не совсем красиво, но быстрое решение для одной страницы, на которой я требуется что-то подгонять.

Проблема, с которой я столкнулся, заключалась в том, что теги привязки уже были удалены, когда была запущена функция Next(), поэтому для выполнения функции не было элемента.

ответ

1

Я не уверен, если у меня есть ясно, что вы пытаетесь достичь, но если у вас есть обработчик щелчка:

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

В делать то, что вы можете повторить событие щелчка везде вы хотите с:

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

Также, это хорошее объяснение '.on' vs' .click'. http://stackoverflow.com/questions/9122078/difference-between-onclick-vs-click –

0

с отправленными вами js, вы привязываете событие click к каждой кнопке с помощью класса учебной кнопки.

Вы также можете указать одну кнопку, используя идентификатор элемента, для которого вам нужно будет привязать один обратный вызов к каждой кнопке.

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

UPDATE:

После отступив от него на некоторое время я нашел простое решение, что просто использовать разводной патч на функции в сценарии и добавить свой личный код, который состоит из открытия/закрытия требуемый div.

Так это было как

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

Не совсем красиво, но быстрое решение для одной страницы, на которой я требуется что-то подгонять.

Проблема, с которой я столкнулся, заключалась в том, что теги привязки уже были удалены, когда была запущена функция Next(), поэтому для выполнения функции не было элемента.

Смежные вопросы