Jquery将点击功能添加到具有相同类的几个跨度答案

【问题标题】：Jquery adding click function to several spans with the same ClassJquery将点击功能添加到具有相同类的几个跨度
【发布时间】：2014-06-05 21:03:44
【问题描述】：

我正在尝试使用 jquery 将 .click() 函数添加到使用它们的类动态生成的几个跨度中。我正在尝试的基本上是：

$(".spanClass").click(function () {});

我也试过了：

$(".spanClass").on("click", function () {});

现在，在某种程度上，这一切都奏效了。我的问题是 .click() 仅被分配给此类的第一个跨度。当我点击它时，这个类的所有其他跨度绝对没有任何作用。显然，我需要班级的每个跨度都有.click()。

请注意，我的跨度包含在表格的单元格内，这一点可能很重要。每个跨度位于不同的单元格中，每个表格行只有一个单元格包含一个跨度。

非常感谢任何帮助。

我正在使用的 JSFiddle。 JSFiddle链接

编辑说明：最初这个问题涉及使用 ID 而不是类。人们注意到我应该改用 class，如果这不起作用，应该编辑问题。

编辑 2：添加了有关表格的信息。

最终编辑：选择了最佳解决方案。如果您遇到此问题，最好的答案是正常运行。我的问题是我的 .on("click") 函数本身的脚本问题。

【问题讨论】：

【解决方案1】：

您需要使用class 而不是id。

id 在整个页面中应该是唯一的：

ID 在文档中必须是唯一的，通常用于使用 getElementById 检索元素。

因此，尝试将click 事件分配给它只会在第一次出现id = spanId 时触发

请参阅下面的示例，并使用.on("click", function()) 而不是.click()

$(".yourspanclass").on("click", function(){
    // do what you need on click 
});

查看一个工作示例HERE

【讨论】：

使用这种精确的语法，click 方法仍然只在类的第一个 span 上触发。 $(".mySpanClass") 成功返回我需要单击才能处理的所有跨度，但唯一在单击时执行任何操作的是第一个。
你看过我的小提琴了吗？每个跨度都会触发带有自己内容的警报。如果此代码不适合您，那么我认为您的 HTML 有问题。请使用您的实际代码创建一个小提琴并发布链接
我已经更新了我原来的问题，提供了更多细节。除了在几个额外的 Div 中之外，这基本上就是我的页面布局的外观。这很简单。我认为将它包含在表格中可能会导致某种问题，但是使用 JSFiddle，一切仍然有效。 JSFiddle：jsfiddle.net/4eLpK
仔细检查您的 HTML :) ps：在原始问题中发布您的小提琴链接，它会比这里更有帮助
这似乎不是 HTML 问题。问题出在我的脚本中。当我从脚本中删除所有内容并发出警报时，它会在所有跨度上运行。很奇怪，我用 JSHint 和所有东西验证了我的脚本。更奇怪的是，第一个起作用了，而其余的却没有。总的来说，这个问题虽然得到了回答。你帮了大忙。选择最佳答案。我不认为我可以关闭。