2012-03-24 2 views
0

Почему скрипт в jquery mobile collapsible fire дважды, спасибо в продвинутом виде.сценарий внутри jquery мобильный разборный огонь дважды

Обновление: Код показывает, что при нажатии «btnonce» только 1 предупреждение, но «btntwice» 2 оповещения, только разные - это «btntwice» javascript под «div data-role =« collapsible », почему он срабатывает дважды?

<div data-role="page" id="page"> 
    <div data-role="content"> 
<script type="text/javascript"> 
    $('#page').live('pageinit', function (event) { 
    $("#btnonce").click(function() { 
    alert("Handler for .click() called."); 
    }); 
}) 
</script> 
<div data-role="collapsible" data-collapsed="false" id="one"> 
<script type="text/javascript"> 
    $('#page').live('pageinit', function (event) { 
     $("#btntwice").click(function() { 
     alert("Handler for .click() called."); 
    }); 
    }) 
</script> 
<h3>Test</h3> 
<input type="button" id="btntwice" data-icon="check" value="fire twice" ></input> 
<input type="button" id="btnonce" data-icon="check" value="fire once" ></input> 
</div> 
</div> 
</div> 

http://jsfiddle.net/M8PM2/39/

ответ

0

Изменение JavaScript для этого:

$('#page').live('pageinit', function (event) { 
    $("#btnonce").click(function() { 
     alert("Handler for .click() called."); 
    }); 
    $("#btntwice").click(function() { 
     alert("Handler for .click() called."); 
    }); 
}) 

Working example here

Ваш click обработчик был добавляемого дважды - see this example

+0

спасибо ManseUK, но, как и ваш «см. Этот пример», почему он добавляется дважды (alert ('Called');)? – tuanzhang

0

Похоже, вопрос с тем, как jqm складная функция _create использует JQuery wrapInner(). Известна ошибка jQuery (или это функция?), В которой теги скриптов внутри содержимого, которые должны быть завернуты, повторно выполняются логикой domManip. Хорошие времена.

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

collapsibleContent = collapsible.wrapInner("<div class='ui-collapsible-content'></div>").children(".ui-collapsible-content"), 

Лично я собираюсь идти со старой школы «если (alreadyRan) возвращение; alreadyRan = TRUE;» - тип флага , Меня тошнит от FORTRAN.

Update

Так что я в конечном итоге происходит следующее в моей настройки jqm сценария (для запуска на каждой странице и «суб» страницы):

$(document).on({ 
    pagecreate: function (e) { 
     $(':jqmData(role=collapsible) script').remove(); 
    } 
}, ':jqmData(role=page)'); 

Кажется достаточно безвредны. Я всегда могу добавить класс в свой скрипт и изменить селектор, если по какой-то причине я хочу выполнить встроенные скрипты дважды. Что-то вроде:

$(':jqmData(role=collapsible) script:not(.do-not-remove)').remove();