javascript - .click 函数不适用于使用 .fadeIn 加载到 div 中的内容

标签 javascript jquery html css click

<分区>

我有一个页面,中间有一系列 div,右边有一个垂直列。当您单击中心的其中一个 div 时,有关该元素的详细信息将显示在垂直列中。最初在右栏中有一些带有图像的内容,单击该图像会导致该栏扩展和收缩。

我遇到的问题是,当您单击中间的一个 div 并将新内容加载到右列时,当您单击新图像时,控制展开/收缩的 .click 函数不再起作用。

页面:goo.gl/aNJ8YP

控制展开/折叠的代码:

<script>
$('.preview-img-overlay').click(function() {$('.previewPane').toggleClass('expanded-preview');});
</script>

控制将元素详细信息加载到垂直列中的代码:

<script>
    $(function () {
        $(".clicky").click(function () {
            var content_id = $(this).attr('href');
            $('#previewContainer').hide().html($(content_id).html()).fadeIn(500);
            return false;
        });
    });
</script>

如有任何帮助,我们将不胜感激。

最佳答案

尝试将此语法用于点击事件

$(document).on('click', '.clicky', function () {
   //do stuff here
});

这应该处理添加到 dom 的元素以及 dom 上预先存在的元素的点击事件。希望这有帮助!

关于javascript - .click 函数不适用于使用 .fadeIn 加载到 div 中的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28202277/

上一篇:html - 麻烦在CSS中命名一个td

下一篇:css - 使用 mixins 时 Bootstrap 2 列问题

相关文章:

javascript - 特定 anchor 链接的平滑滚动

javascript - AngularJS:如何将 HTML 页面包含到对话框中?

javascript - 根据 Javascript 中的选择填充下拉列表

html - Webkit 转换改变 <p> 元素的宽度...为什么?

javascript - AngularJS - 根据 ng-repeat 中的索引不同的 HTML

javascript - jQuery:每个 "each"项都需要一个 "click"吗?

javascript - 内联 javascript onclick 事件

javascript - window.getSelection().toString() 在 Firefox 中不起作用(在 Chrome 中起作用)

javascript - SVG 文字环绕

javascript - click.modal.data-api 作为事件名称是什么意思?