【问题标题】：Phonegap - jquery Mobile : button click event not able catch in androidPhonegap - jquery Mobile：按钮点击事件无法在android中捕获
【发布时间】：2013-04-01 11:48:45
【问题描述】：

我正在使用phonegap 和Android 的jQuery 移动插件开发一个示例应用程序。我创建了一个页面 main.html。从 main.html，我能够捕捉到事件。在主页中按下按钮后，我使用（$.mobile.changePage("path")）函数将内容更改为 signup.html。我在 signup.html 中有按钮，但是当我单击该按钮时，单击事件不会被触发。我也已经在 signup.html 中加载了所有的 js 文件。做错了什么？请指导我。

澄清：我是否应该只保留一个 html (main.html) 并通过它进行页面导航？

【问题讨论】：

标签： android jquery jquery-mobile cordova

【解决方案1】：

如果您的第二页 javascript 放置在 HEAD 内容中

如果我理解正确，您是在使用 ajax 将此页面加载到 DOM 中吗？如果这是真的，那么我理解你的问题。你看，当 ajax 用于页面加载时，只有 BODY 内容被加载到 DOM 中。

如果您在第一个 HTML 文件中初始化您的第二个 html 页面 javascript 或将您的 SCRIPT 块移动到第二个 HTML BODY 内容。

另外，我在其他ARTICLE中描述了这个问题，其中包含更多细节和一些示例，或者可以找到HERE。

如果您有多个具有相同 id 的按钮

这也可能是一个有点不同的问题。你看，如果你有 2 个具有相同 id 的按钮，它们都在一个 DOM 结构中。如果您尝试在第二页按钮上绑定单击事件，则该相同事件将绑定到第一页上的按钮。因为它们具有相同的 id，jQuery 会将事件绑定到 DOM 中找到的第一个按钮（具有该 id）。

要解决这个问题，您需要使用一个名为 active page 的 jQM 构造函数。还有一个警告，下一个代码示例仅适用于在 pageinit 事件之后初始化的页面事件，例如 pagebeforeshow 或 pageshow 事件： p>

$(document).on('pagebeforeshow', '#yourPageID', function(){     
    // Registering button click  
    $(document).on('click', $.mobile.activePage.find('#myButtonID'), function(){
        // Do something
    });
});

这行代码：

$.mobile.activePage.find('#myButtonID')

只会获取在当前活动页面中找到的按钮“#myButtonID”，无论 DOM 中存在多少其他具有相同 id 的按钮。

回答最后一个问题

关于您的最后一个问题。无论您使用哪种模板结构（1 个带有多个页面的 HTML 或多个 HTML），您只需要担心我之前提到的事情。

【讨论】：

【解决方案2】：

你是否在 sn-p 之后将你的代码包装起来了？

$(document).on('pagebeforeshow', '#yourPageID', function(){     
    // Registering button click  
    $('#myButtonID').bind('click',function(){
       $.mobile.changePage('yourfile.html');
    });
});

如果你只是将它包裹在你的 <script></script> 标签内，该事件将不会触发。

您是否在控制台中遇到任何错误？检查DDMS。

【讨论】：