Question

我在使用jquery中的委托时遇到一个奇怪的问题。

HTML：

<div id="workbenches">
    <div class="carousel-inner">
        <div class="item active">
            <div class="workbench">
                <a href="javascript:void(0)">Link</a>
            <div> <! .workbench -->
        </div> <!-- .item -->
    </div> <!-- .carousel-inner -->
</div> <!-- #workbenches -->

使用Javascript：

在下面的javascript中，我克隆了div.item对象。

<script type="text/javascript">
    $(document).ready(function() {
        var workbenchObject = $('.carousel-inner .item');
        workbenchObject.clone().prependTo('#workbenches .carousel-inner').removeClass('active');
        workbenchObject.clone().appendTo('#workbenches .carousel-inner').removeClass('active');
    });
</script>

由于某些代码是由javascript生成的，因此我尝试将click事件绑定到a代码。

<script type="text/javascript">
    $('.workbench').delegate('a', 'click', function() {
        alert('hello');
    });
</script>

但是，上面的代码仅适用于原始a标记（不适用于克隆对象）。

代码有什么问题？你能救我吗？

Answer 1

您需要将处理程序绑定到#workbenches（或#workbenches .carousel-inner），因为.workbench对象是动态创建的。即使在事件中，也应该将对处理程序的委托添加到静态元素中。

$('#workbenches').delegate('.workbench a', 'click', function() {
    alert('hello');
});

委派不在克隆对象上工作

1 个答案: