Question

我正在尝试在Wordpress的后端实现类似的功能，当您将鼠标悬停在帖子表的一行上时，它会显示编辑，垃圾和预览链接。

然而，当我尝试这个时，它会将链接附加两次，这有点问题。我看到悬停在chrome中悬停时两次触发功能关闭，但是在opera中尝试了它并且发生了同样的错误，所以我认为这不是问题。

Here是它的演示。

这是代码

// Table row hover displays links

$('table.tablesorter tbody tr').hover( 
     function() {  // mouseover 
          $(this).children('td:nth-child(2)').append('<p class="links"><a>Edit</a><a>Preview</a><a>Delete</a></p>'); 
     }, 
     function() {  // mouseout 
          $(this).children('td:nth-child(2)').find('p.links').remove(); 
     } 
   );

你能看出它为什么两次添加链接而不是一次吗？

Answer 1

您已将js/custom.jquery.js包括两次。进入head后，body关闭一次。与jquery

相同

Answer 2

它没有回答您的问题，但您可以隐藏您的＆lt; p＆gt;当鼠标移出并在鼠标结束时显示它。

Answer 3

在鼠标悬停/鼠标移动时创建元素在浏览器上工作得更多，然后创建这些元素（已经在display:none;的标记中）并显示/隐藏它们。您的鼠标悬停和鼠标移动可能都是两次触发，它无法找到要删除的元素并继续添加它..

$('table.tablesorter tbody tr').hover( 
     function() {  // mouseover 
          $(this).find('.myControls').fadeIn(); 
     }, 
     function() {  // mouseout 
          $(this).find('.myControls').fadeOut(); 
     } 
   );

Answer 4

你必须检查它是否得到相同的对象

示例：

$('#updateCart').on('mouseenter', function (event) {
        if (event.handled !== true) { .....
                  //Put your code in here
          }
}

挂起的jQuery追加被调用两次

4 个答案: