1

我有一个 div 会在鼠标悬停时弹出，我正在使用 html() 插入一些内容。而且我希望代码的某些部分保持不变。

<div id="pop_div" ><span>X</span></div>


$("#team_div > ul img").bind('mouseenter',function(){
  $("#pop_div").html('<img src="' + img + '"/>' + content );
 });

并且 onclick 我正在隐藏 div。

$('#pop_div span').click(function(){
  $("#pop_div").hide();
});

我的问题是，我不能使用下面的代码，因为 jquery 没有为该标签分配任何事件

$("#pop_div").html('<span>X</span><img src="' + img + '"/>' + content );

（我不能使用 livequery 插件）

我很欣赏你的评论。

4

2 回答 2

1

您正在替换 的全部内容#pop_div，当您插入 HTML 代码时，正在创建新的 DOM 元素，这就是未绑定事件的原因。

span 元素从 DOM 中移除，附加到它的事件不再起作用。

我认为您不需要替换该 div 的所有内容，您可以像这样构造您的 div：

<div id="pop_div" >
  <span>X</span>
  <img/>
  <div id="content"></div>
</div>

在你的鼠标输入：

$('#team_div > ul img').bind('mouseenter',function(){
  $('#pop_div img').attr('src', img); // set the image source
  $('#pop_div #content').html(content); // display the content
});

图像源被改变，content变量被插入到'#content'div 中。

您的点击处理程序将保持原样，因为 span 元素不受影响。

于 2009-08-03T05:12:18.557 回答
1

CMS 是对的。另外从 jQuery 1.3 开始，您可以将事件与 live 函数绑定，该函数会将事件绑定到所有当前和未来的元素。

$('#team_div > ul img').live('mouseenter',function(){
  $('#pop_div img').attr('src', img); // set the image source
  $('#pop_div #content').html(content); // display the content
});
于 2009-08-03T06:34:13.430 回答