Question

我正在开发一个交互式元素，要求用户通过单击一个段落将段落排序为正确的顺序，然后单击第二个段落以在第二个段落之前或之后插入第一个段落（取决于它们是否是在列表中上下移动一段）

我的问题是当一个段落被移动到另一个地方时，点击的第二个段落的悬停状态保持活动状态 - 即使该段落没有被悬停。这种情况发生在鼠标移动之前，此时正确的段落显示悬停状态。

例如，单击第1段，然后单击第2段。尽管鼠标悬停在第1段上，但段落切换位置但悬停状态在第2段仍处于活动状态。注意 - 此问题不会出现在Firefox中。

有什么想法吗？

function swapParas(node1, node2) {
if (node1.index() > node2.index()) node1.insertBefore(node2);
else node1.insertAfter(node2);
node1.hide().fadeIn();
node1.removeClass('selected');
}

Answer 1

.selected:hover {
  background:green;
}

试试上面的代码。

希望这是你想要的。

这是一个IE修复程序。看起来很奇怪，但这是你能得到的最好的：

function swapParas(node1, node2) {
  if (node1.index() > node2.index()) node1.insertBefore(node2);
  else node1.insertAfter(node2);
  node1.removeClass('selected');
  node2.after("<div class='para'>" + node2.html() + "</div>");
  node2.remove();
}

使用jQuery insertBefore不正确的悬停

1 个答案: