1

我正在开发某种小型游戏，但遇到了问题。

我正在使用 Jquery 移动。

问题很简单，我的动态内容会以视觉方式加载，我确实看到卡片背面，但点击事件会触发。我怀疑我从 jquery 准备的文档与此有关。

我尝试了各种不同的东西，例如通常使用列表来解决问题的刷新，但由于这是一个 UI-Grid，所以这是不同的。

我下面的示例代码是结构的内容和方式的简短片段。

我正在寻找一种方法来刷新我在 ui-grid-c 中的内容，以便我的点击事件可以触发。

在底部有一个警报（“我想看到这个弹出消息”）；。我想看到这个弹出。

在我的 index.html 文件中

<script src="js/events.js"></script>        
<script src="js/newgriditems.js"></script>

这是我的静态 HTML JQM 网格

<div class="ui-grid-c" id="cards">

</div>

我从 newgriditems.js 调用这个函数

function newCards() {
    var new = '<div class="ui-block-a">
   <img src="img/backside.jpg" />
   </div>';

    $("#cards").html(new).trigger("create");
    $("#cards").page();
}

在 events.js 中有一个

$(document).ready(function() {

  $(".ui-grid-c div img").click(function() {
    alert("I want to see this popup message");
  });

}

它可以工作，如果我将内容添加为静态内容。

4

1 回答 1

1

首先，始终避免.ready()在 jQuery Mobile 中使用。

重要提示：使用$(document).bind('pageinit')，而不是$(document).ready()

在 jQuery 中学习的第一件事是调用 $(document).ready() 函数中的代码，以便在加载 DOM 后立即执行所有内容。但是，在 jQuery Mobile 中，Ajax 用于在您导航时将每个页面的内容加载到 DOM 中，并且 DOM 就绪处理程序仅针对第一页执行。要在加载和创建新页面时执行代码，您可以绑定到 pageinit 事件。此事件在本页底部有详细说明。

来源：http: //jquerymobile.com/demos/1.2.0/docs/api/events.html

动态添加元素时，需要以这种方式附加事件

$('.static_parent').on('event', '.dynamic_element', function () {
 // code
});
于 2013-10-11T10:03:08.980 回答