Javascript 使用JQuery动态插入列表项会产生与硬编码列表项不同的结果…为什么？

我创建了一些html，它有两个不同的下拉框，第一个让用户选择应该在报告中查看哪些字段，第二个让用户选择应该在报告中查看哪些月份。我首先对两个下拉框的列表项进行了硬编码，一切都按预期进行。我为这两个下拉菜单都分配了一个虚拟类，称为“dropdown menu”，这样它们都可以被同一个javascript函数引用。出于某种原因，“Filter Columns”下拉框不会在我创建的代码段中打开……但这不是我遇到的问题（因此请不要对此进行旁敲侧击）

$（文档）.ready（函数（）{
var期权=[]；
$（'.下拉菜单a'）。在（'单击'）上，函数（事件）{
console.log（事件）；
var$target=$（event.currentTarget），
val=$target.attr（'data-value'），
列='表'.+val，
$inp=$target.find（'input'），
idx；
if（（idx=options.indexOf（val））>-1）{
选项。拼接（idx，1）；
setTimeout（函数（）{
$inp.prop（'checked'，true）
}, 0);
$（列）.toggle（）；
如果（$target.find（“第二行”））{
var cs=$（“.topRow”）.attr（“colspan”）；
$（“.topRow”）.attr（“colspan”，parseInt（cs）+2）；
}
}否则{
选项。推送（val）；
setTimeout（函数（）{
$inp.prop（'checked'，false）
}, 0);
$（列）.toggle（）；
如果（$target.find（“第二行”））{
var cs=$（“.topRow”）.attr（“colspan”）；
$（“.topRow”）.attr（“colspan”，parseInt（cs）-2）；
}
}
$（event.target）.blur（）；
返回false；
});
})

滤柱












选择月份

快速尝试以下方法：

改变这个

$（'.dropdown menu a'）。在（'click'，函数（事件）{

为此：

$（文档）。在（'click'，'上。下拉菜单a'，函数（事件）{

然后再回来看看这是否奏效

---

更改的原因是：是的，

.on（）

应该适用于动态创建的元素，但是没有太多的文献表明，

.on（'click'…

是在DOM中首先不存在的元素上。这就是为什么我们使用

$（文档）

来侦听是否存在“偶数”，因为每次文档都在那里。然后，我们通过在

.on（）

函数中添加类来指定您要单击的内容。

我不确定您在问什么。简单的问题是“为什么不将事件添加到我新创建的元素中？”？如果是这样，这是一个重复。可能最好将处理程序附加到下拉菜单并以其锚定为目标。@DaveNewton，我完全同意，但出于他的目的，他使用锚定标记作为选择器。我只是想解释一下使用

.on（）的更好方法

先生，你真是个天才！！完美地解决了这个问题！！接下来的几件事是：1.我尝试将处理程序附加到锚定事件上--部分奏效。上面的javascript会一直打开下拉框，直到他们单击框外的某个位置，这样用户就可以进行一轮选择，而不必一直打开框。2我怎样才能把你的答案标记为正确的？我认为我没有足够的分数去做这件事：（算了出来……我把事情弄得太难了）：但是，跟着把处理程序附加到下拉菜单上，我会认为自己是一个“高级新手”。当涉及到我的代码技能时，我总是想学习做事情的最佳/更合适的方法。那么有没有更好的方法，我应该尝试一下？