Javascript 单击事件仅在元素放置在标题中时激发

我有一个带有自定义导航脚本的单页应用程序UI。这个脚本在一个风格简约的测试页面中工作得非常完美，但是当我把它放到实际的应用程序UI中时，它开始变得不稳定，并且点击事件并没有像我期望的那样始终如一地触发

我已经将click事件绑定到每个链接，但这些事件似乎只有在元素放置在标题中时才会触发

HTML 我剥离了实际的导航逻辑，只是为了让它更容易理解

问题 当我加载页面时，我在处理程序注册上设置了一个断点，我可以看到

$（“[data role='navigation']”

检索到的所有元素。我看到了4个元素：

中的三个链接，以及

.pageFooter

部分

#mainView

中的一个单独链接

您会注意到（除了ID属性及其在页面上的位置），

\headerLink

和

\footerLink

是相同的

当我单击

#footerLink

时，什么也没有发生。我知道该元素是在我注册事件处理程序时提取的，因此它应该发出“触发”警报消息，但它没有

我还尝试过在文档周围移动

#footerLink

（一次将其向上拉一层，并在每一站进行测试。直到链接进入

当我单击

#headerLink

时，事件会完全按照预期触发。在本例中，我收到“已触发”消息，在实际应用中，我看到一个成功的导航事件

---

所以，问题是：“我遗漏了什么？”关于阻止事件触发的

#footerLink

有一些不同之处，但我不知所措。

我已经检查了你的案例。但对我来说效果很好

请用以下内容替换jQuery函数：

$(document).ready(function(){
    $("[data-role='navigation']").unbind("click.cgt_pathfinder").bind("click.cgt_pathfinder",function(event){
        alert("Triggered = "+$(this).text());
    });
});

---

可能是打字错误和标签不平衡

    <section data-role="page">
        <section id="mainView data-role="view">  // No (") for id
            <section class="pageContent">

            </section>

您的代码是否动态更新
#footerLink
元素

如果此元素通过您的代码添加到页面中（例如：通过
$（'.pageFooter'）.append（html）
），则需要将单击操作绑定回此新元素


是否有其他代码（您的或某些插件的代码）这可能会更改页面中的
单击事件处理程序，但不会更改页眉中的事件处理程序？
您是否可以提供最少的代码我提供了重新创建问题所需的所有代码。事实上，我编辑了HTML/JS文件以匹配此确切内容，并且我看到了与问题中描述的相同的结果通过放置事件注册进行检查离子代码在
$（document）.ready（function（）{}）；
block？@vijayP它实际上在
ready（）中
block。我没有费心把它包括在内，因为在处理处理程序注册时，它似乎很明显。很抱歉造成混淆。--更新了问题，将其包括在内。感谢您捕捉到拼写错误，但这似乎并不能解决问题。@Mike，您能检查一下JSFIDLE链接吗？它似乎有效它肯定有效。我相信n自己在一个新的fiddle中从头开始写了它，只是为了检查是否正常，但它在运行中的应用程序中也肯定不起作用。是的。我把东西剥去了，所以工作的JS fiddle和我的本地应用程序之间唯一剩下的区别就是CSS文件。然后我拿走了CSS文件，但它在本地仍然不起作用。我知道我遗漏了一些东西随着这些事情的发展，当我（或其他人）最终找到它的外观文本只证明哪个元素被点击了，但是
#footerLink
从来没有到达那一行，所以这并不能真正解决问题。也就是说，我自己看到我在这里发布的标记在JS fiddle中工作，这让我更加困惑，因为它肯定不在我的lo上cal machine.Nope和Nope。将动态添加大量内容，但按钮是静态的elements@Mike：页面中包含的js库列表是什么？目前，它是最新版本的jQuery和我的自定义导航脚本（我已将所有其他内容都禁用，以查看是否存在冲突）.我还拼凑出事件处理程序并不总是被分配（尽管元素出现在jQuery对象中），所以我相信这个bug存在于我的自定义脚本中，但是这个脚本有太多的东西在不断变化，所以我不愿意分享它。我现在正在重写它的一些部分，以便更好地组织它。一旦完成，我将分享，因为问题似乎就在这里。尝试检查绑定了哪些事件处理程序。在Firefox中，您可以安装FireQuery插件，该插件将在您的检查器中添加绑定到每个DOM节点的事件处理程序列表。这将+在代码中设置断点，以查看在脚本执行过程中的各个点上注册了什么和没有注册什么。
$(document).ready(function(){
    $("[data-role='navigation']").unbind("click.cgt_pathfinder").bind("click.cgt_pathfinder",function(event){
        alert("Triggered = "+$(this).text());
    });
});

    <section data-role="page">
        <section id="mainView data-role="view">  // No (") for id
            <section class="pageContent">

            </section>

        </settings>   // No opening tag for settings
    </section>