Question

我有一些像这样的HTML东西

<div id='divItemHolder'onMouseout='HideEditDiv()'  onMouseover='ShowEditDiv()><div id='itemName'></div><div id='divEdit'></div></div>

并在我的脚本中

 function ShowEditDiv() {
  $("#itemName").removeClass().html("<a href=\"javascript:Edit()">Edit</a>").addClass("divEdit");
   }
function HideEditDiv() {
$("#itemName").html("&nbsp;").addClass('divEdit');

 }

我的要求是当用户将光标放在整个主div（divItemHolder）上时显示编辑链接，并在他移出时隐藏它。这很好。显示编辑链接。但是当我将光标放在编辑链接上时，它就消失了。甚至我的点击功能都没有开火！

任何人都可以解决这个问题吗？

Answer 1

你没有逃脱你的"，你忘了结束另一个。试试这个：

function ShowEditDiv()
{
    $("#itemName").removeClass().html("<a href=\"javascript:Edit()\">Edit</a>").addClass("divEdit");
}
function HideEditDiv()
{
    $("#itemName").empty().addClass('divEdit');
}

这是一个更好的方法：

$(document).ready(function()
{
    $(".parent")
        .mouseenter(function()
        {
            $(this).children(".edit").show();
        })
        .mouseleave(function()
        {
            $(this).children(".edit").hide();
        })
        .children(".edit").hide();
}

使用HTML：

<div class="parent">
    ...
    <div class="edit">
        <a href="javascript:Edit()">Edit</a>
    </div>
</div>
<div class="parent">
    ...
    <div class="edit">
        <a href="javascript:Edit()">Edit</a>
    </div>
</div>
...

子div在mouse div的mouseout上消失了

1 个答案: