php - 更改悬停时的背景颜色，jquery

Question

我有这段代码，效果很好，但是当我刷新页面上的 div 时，代码就会中断，并且 .item_control_box 不再隐藏，我想我必须重写它才能与 .生活，但我不知道如何生活。

$(document).ready(function() {
    $(".item_control_box").hide();
    jQuery('.each_item_container').hover(function() {
        jQuery(this).find('.item_control_box').show()
    }, function() {
        jQuery(this).find('.item_control_box').hide();
    });
});

谢谢!

Answer 1

您是否通过 AJAX 动态重新加载您的 div？只是好奇。这是我所看到的:

当前的 js 代码将在文档渲染时运行

$(document).ready(function() {
    $(".item_control_box").hide();

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

这将隐藏所有已存在的具有 item_control_box 类的当前元素

jQuery('.each_item_container').hover(function() {
    jQuery(this).find('.item_control_box').show()
}, function() {
    jQuery(this).find('.item_control_box').hide();
});

^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

将悬停事件处理程序附加到类each_item_container的所有当前元素，然后在悬停时查找item_control_box的子元素。

});

如果您通过 AJAX 或其他方式将新数据加载到 div 中，您需要确保两件事:

1) 带有 item_control_box 的元素首先不会显示。您可以通过简单的 style="display:none;"

来完成此操作

2) 确保将悬停事件分配给 .each_item_container。您需要通过 @PeterStuart 描述的实时方法 jQuery('.each_item_container').live('hover', function()... 来完成此操作

最后但并非最不重要的一点是，不确定您使用的是哪个版本的 jquery，但在 1.7+ 中 live() 方法已被弃用。使用 on() 方法代替。以下是引用链接:http://api.jquery.com/live/