Question

单击按钮时，我使用了单击处理程序来执行请求。当按钮位于滑块之外时，此事件很有效。 如果我在滑块处应用点击事件也是如此。我尝试了许多方法使其工作，但仍然没有理解可能导致这种情况的原因。

像jquery步骤这样的jquery脚本会影响另一个jquery脚本吗？

HTML：

<div id="main">
<div id="slider">

    <h3>1</h3>
    <section>
        <p id="head">I'm using JQuerySteps.</p>
        <p id="body"><button type="button">Here is the button.</button></p>
    </section>

</div>
</div>

jQuery的：

$("button").click(function(){

    $("#main").load("get.php", function(responseTxt, statusTxt, xhr){

    });

});

问题： 当我尝试在jquery步骤（#slider）中单击按钮时，单击处理程序不起作用。

我确定这个问题听起来很愚蠢，但我会很感激任何简短的建议或提示。谢谢，弗拉基米尔。

Answer 1

这将在匹配的元素上创建一个点击处理程序：

$("button").click(function(){
    // ...
});

然而，这将从DOM中删除该元素（我假设将其替换为另一个类似的？）：

$("#main").load();

原始button现已消失，其点击处理程序也已消失。因此，单击新按钮将不执行任何操作，因为它没有处理程序。

不是将处理程序直接附加到（短暂的）button，而是将其附加到公共父元素并过滤button。像这样：

$(document).on('click', '#body button', (function(){
    // ...
});

这样处理程序本身附加到一个不变的元素（在这种情况下是document，虽然任何非变化的分层父元素都会这样做）因此处理函数不会丢失。这称为event delegation。

单击处理程序找不到目标按钮

1 个答案: