2016-01-11 1 views
0

Я столкнулся с проблемой. Существует страница со сценарием для загрузки дочерней страницы и регистрации пользовательского события, которое запускается в Subform.JQuery Пользовательское событие со страницы, загруженной AJAX, вызываемой только один раз

---- Default.aspx ----

<body> 
<input type="button" class="clickable" value="Load child doc" /> 
<hr /> 
<div id="container"></div> 
</body> 

<script> 
var clickHandler = function() { 
    $.ajax("Subform.aspx", { 
     method: "GET", 
     success: function (data) { 
      $('#container').html(data); 
     } 
    }); 
} 

$(function() { 
    $('body').on('click', clickHandler); 

    $('body').on("dataLoaded", function (param) { 
     console.info("Custom event triggered", param); 
    }) 
}); 

---- Subform.aspx есть скрипт, который запускает пользовательское событие "DataLoaded" ----

<html> 
<header> 
    <script src="scripts/jquery-1.7.1.js"></script> 
</header> 
<body> 
..context of Subform... 
<script> 
     $(function() { 
      $('body').trigger("dataLoaded", { key: "value from sub form" }); 
      console.log("ChildPage loaded. dataLoaded event triggered") 
     }) 
    </script> 
..... 
</body> 
</html> 

Issue заключается в том, что после того, как подформат загрузился в контейнер (и готовый документ был запущен в загруженном ajax файле - я вижу сообщение: «childPage загружен ..»), пользовательское событие «dataLoaded» запускается, но обработчик вызывает только один раз - первый раз, когда ajax загружен childPage. Все остальные ajax вызовы загружают контекст подчиненной формы, текст «ChildPage загружен, запущено событие с загрузкой данных», инициировано событие «dataLoaded», но обработчик событий для настраиваемого события больше не вызывается .. Что происходит здесь? Я ожидаю, что каждый раз, когда загружается дочерняя страница и настраивается событие, будет вызываться обработчик для него.

ответ

0

Проблема/решение найдено. Subform.aspx - это HTML-страница с ссылочным тегом сценария JQuery в заголовке. Когда подчиненная форма загружается в родительский #container div - subform перезагружается jQuery и обработчик затерялся.

Решение было простым - в subform.aspx удалить <script> тег и все другие теги, которые могут сделать основной документ недействительным, например body, html, header. Оставьте только содержание, вроде этого

<div> 
SubForm 
    Ajax response.... 
<script> 
    $(function() { 
     debugger; 
     $('#container').trigger("dataLoaded", { key: "value from sub form" }); 
     console.log("ChildPage loaded. dataLoaded event triggered"); 
    }); 
</script> 

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

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