我有一个使用 JavaScript/jQuery 创建的列表视图。当我单击一个列表项时，我必须执行代码。
场景1： 我使用这个代码：
$("div#home ul#one li").live('click', function() { console.log('click') });
此代码拾取点击，但它拾取两次。因此，当我单击一个列表项时，它会输出两个 console.logs
场景 2： 我有此代码用于在普通 index.html 文件中创建的另一个列表。
$("div#home ul#two li").off('click').on('click', function() { console.log('click') });
此代码不会执行代码两次。
无论如何我可以让场景 2 在 JavaScript 创建的列表视图上工作吗？（也欢迎任何其他建议）
如果您正在动态创建元素..您需要使用委托表单
$("div#home").on('click','li', function() { console.log('click') });
将事件处理程序绑定到绑定时存在的最近的静态父级
如果你ul的不是动态的 - 你可以将它绑定到 ul
$("div#home ul").on('click','li', function() { console.log('click') });
要让场景 2 用于动态附加元素，请on与委托一起使用，如下所示：
$("#two").on('click', 'li', function() { console.log('click') });
我缩短了第一个选择器，因为如果您选择 by id，那么它应该是唯一的。
另外，我会假设第一个场景会两次记录到控制台，因为您有嵌套li元素？
问题是您没有on在正确的位置绑定您的侦听器，您在任何页面的pageinit处理程序中声明以将您的侦听器添加到 li：on$("div#home").on('click','li', function() { console.log('click') });
因此，您在页面上附加了一个侦听器，div#login并在第二页上附加了冗余的第二个侦听器div#home。当您单击li一个事件时，将触发两个侦听器，然后您将获得两次单击。
您应该做的是$(document).on('pageinit', function()将您的 on listener 声明包装在一个条件中，以检查您在哪个页面上：
if ($(this).attr(id') === 'home'){
$("div#home").on('click','li', function() { console.log('click') });
}
这是一个简单的解决方案，您真正应该做的是根据触发pageinit事件的页面分支代码并基于它调用正确的代码。请参阅：我的关于构建 jQM 应用程序的指南。
它的要点是将数据属性附加到div[data-role=page]描述您的页面的 etc 中，然后为每个页面调用单独的代码。（而不是像本例中那样使用 ID，因为您可以在多页面 jQM 应用程序中轻松拥有多个页面实例）
我无法创建 jsFiddle，因为这似乎无法加载我的函数。我已将脚本放在我自己的网站上。
登录设置正常。只需单击登录，就会出现屏幕（主页）。如果您单击其中一个 LI 标记并打开控制台日志，您将看到 2 次单击而不是 1 次。
如果您需要任何代码，请在下面评论。
我使用的当前代码：
$("div#home").on('click','li', function() { console.log('click') });
可以在 custom.js 文件中找到