0

我写了一个图像共享 js 脚本。一旦页面中有图像,它将添加一个 div 包装器。例如,

<img href="xxx.jpg" />

我的脚本将使它成为

<div class="wrapper">
    <img href="xxx.jpg" />
</div>

而且,.wrapper 类中还有一个 mounseover 事件。在下面的代码结构之前,一切都很顺利。我们有一个博客站点,有很多 div 包装器和 img 标签。

<div class="a">
    <img href="xxx.jpg" />
</div>

虽然我的 js 脚本包装了一个“包装”类,但我的 mouseover 事件在这些 HTML 结构中不再起作用。谁能告诉我这里发生了什么?提前致谢!

4

3 回答 3

1

查看 javascript 代码会有所帮助。由此,我的猜测是你没有绑定到.a并且仍然绑定到.wrapper

于 2012-05-03T02:55:15.190 回答
0

这可能是实时事件绑定的情况,您可能需要检查 jQuery 的live,从 1.7 开始,由于ON已被弃用- on() 现在执行 live() 曾经做的事情

您说-一旦有图像,它就会自动换行-您到底是怎么做的?

例如,解决方案可能就在那里。在您检查图像并包装它的地方,您需要再次附加鼠标悬停

//  firstly, why is your image having href=xxx.jpg
//  should be src=xxx.jpg I suppose

$('img[href$="jpg"]').wrap('<div class="wrapper">');

//  Whatever might be your logic above for wrapping
//  you need to again call bind method here OR
//  you need to call one final time at the end of all your code

$('img[href$="jpg"]')
    .parent('.wrapper')
    .bind('mouseover', function() {
        $(this); // $(this) - is your current wrapper div now
        // your code
    });

如果您在包装图像时不知道图像何时出现或者它是通过 ajax 出现的,那么您可能需要查看 jQuery 的livequery插件

$('div.wrapper').livequery(function() {
    $(this).bind('mouseover', function() {
        // your code
    });
});
于 2012-05-03T19:49:01.613 回答
-1
$('img').wrap('<div class="wrapper">');

您应该用 div 包装它并应用于mouseover该 div 而不是图片。

于 2012-05-03T03:08:51.433 回答