Javascript jQuery动态内容';s单击不';行不通

Javascript jQuery动态内容';s单击不';行不通,javascript,jquery,dynamic,click,Javascript,Jquery,Dynamic,Click,我正在编写一个代码,通过添加ul元素动态添加内容 问题是,如果我单击名为savePalette的动态创建按钮,它将无法工作。。尽管它对第一个函数有效,因为我在单击函数之前定义了addPalette函数 据我所知,.on()应该在添加动态内容的情况下工作 这是HTML结构: <ul class="palettes"> <li class="paletteGroup"> <ul> <li class="colo

我正在编写一个代码,通过添加ul元素动态添加内容

问题是,如果我单击名为savePalette的动态创建按钮,它将无法工作。。尽管它对第一个函数有效,因为我在单击函数之前定义了addPalette函数

据我所知,.on()应该在添加动态内容的情况下工作

这是HTML结构:

<ul class="palettes">
    <li class="paletteGroup">
        <ul>
            <li class="colorpalette" style="background-color: #00c4ff;"></li>
            <li class="colorpalette" style="background-color: #00a6ff;"></li>
            <li class="colorpalette" style="background-color: #0091ff;"></li>
            <li class="colorpalette" style="background-color: #007bff;"></li>
            <li class="paletteControls">
                <button name="savePalette" class="savePalette">Save</button>
                <button name="changeName" class="changeName">Change Name</button>
            </li>
        </ul>
    </li>
</ul>
on()
仅在动态元素被委托的情况下使用:

$("ul.palettes").on("click", "button[name=savePalette]", function() {
    alert("Heeeeej");
});
on()
仅在动态元素被委托的情况下使用:

$("ul.palettes").on("click", "button[name=savePalette]", function() {
    alert("Heeeeej");
});

必须将动态元素的选择器放在选择器参数中:

$("ul.palettes").on("click", "button[name=savePalette]", function() {
    alert("Heeeej");
});

必须将动态元素的选择器放在选择器参数中:

$("ul.palettes").on("click", "button[name=savePalette]", function() {
    alert("Heeeej");
});

由于是动态创建的,
.on()
需要更大的范围:

$('body').on("click", "button[name=savePalette]", function() {
    alert("Heeeeej");
});
现在,代码将侦听始终存在的
标记中要单击的
按钮[name=savePalette]


如果您正在动态添加
ul.paletes
及其所有子元素,那么您将希望在主体内而不是
ul

内侦听更改,因为它是动态创建的。
.on()
需要更大的范围:

$('body').on("click", "button[name=savePalette]", function() {
    alert("Heeeeej");
});
现在,代码将侦听始终存在的
标记中要单击的
按钮[name=savePalette]

如果您正在动态添加
ul.paletes
及其所有子元素,那么您将希望在主体内部而不是
ul
中听到更改,它为什么对我有效? 哦,是的,而不是使用

$(“li.paletteGroup”).show(“淡入淡出”,500)

用法:
$(“li.paletegroup”).fadeIn()

看到这个了吗

为什么它对我有用? 哦,是的,而不是使用

$(“li.paletteGroup”).show(“淡入淡出”,500)

用法:
$(“li.paletegroup”).fadeIn()


看到这个了吗

是的,所以你尝试使用.on(“单击”)无效?是的,我现在觉得很愚蠢。。是时候出去呼吸新鲜空气了,我想是的,所以你尝试使用.on(“单击”)无效?是的,我现在觉得很愚蠢。。我想是时候出去呼吸点新鲜空气了嗯,有趣的是他的听众也在工作嗯,有趣的是他的听众也在工作