在JQuery应用功能之前，如何用AJAX生成的HTML填充页面

Question

I can't get the jQuery Mobile functionality to apply after I have populated the schedule div with the AJAX generated HTML containing data-role elements. 在我用包含data-role元素的AJAX生成的HTML填充明细表div后，无法应用jQuery Mobile功能。 I've tried reordering things, including putting the script in the body tag, to no avail. 我尝试重新排序，包括将脚本放在body标签中，无济于事。 Is there a way to force the jQuery to run after my AJAX? 有没有办法强制jQuery在我的AJAX之后运行？

schedule.html:

<html>
  <head>
    <script src="../javascript/agenda.js"></script>
    <script> loadSchedule(); </script>
    <script src="../javascript/jquery-1.11.1.min.js"></script>
    <script src="../javascript/jquery.mobile-1.4.4.min.js"></script>
  </head>
<body>
  <div id="schedule"></div>
</body>
</html>

agenda.js:

function loadSchedule(){
  text = "...LOTS OF AJAX HTML GENERATION...";
  document.getElementById("schedule").innerHTML = text;
}

Apologies ahead of time as I'm a total noob with JS. 抱歉，我对JS非常陌生。

Answer 1

I'm not sure I understand your question exactly but it sounds like you are having trouble applying JQuery events to dynamic content. 我不确定我是否完全理解您的问题，但是听起来您在将JQuery事件应用于动态内容时遇到麻烦。 JQuery handles dynamic content through the .on function which basically retroactively applies your binding to all newly created DOM elements that match your selector. jQuery通过.on函数处理动态内容，该函数基本上将您的绑定追溯应用于与选择器匹配的所有新创建的DOM元素。

JQuery docs link: http://api.jquery.com/on/ jQuery文档链接： http : //api.jquery.com/on/

Usage example: 用法示例：

$(document).ready(function() {
    $("body").on('click', '#my_new_div', function() {
        // this event is fired when clicking on div#my_new_div even if it is dynamically created
    });
});

Hope this helps! 希望这可以帮助！

在JQuery应用功能之前，如何用AJAX生成的HTML填充页面

问题描述

1 个解决方案

解决方案1
0 2014-10-22 22:08:14

在JQuery应用功能之前，如何用AJAX生成的HTML填充页面

问题描述

1 个解决方案

解决方案1 0 2014-10-22 22:08:14

解决方案1
0 2014-10-22 22:08:14