Функция наведения мыши родительского Div вызывается при наведении мыши на дочерний элемент - PullRequest
Новая
       16

Функция наведения мыши родительского Div вызывается при наведении мыши на дочерний элемент

0 голосов
/ 08 октября 2009

У меня есть ниже HTML на моей странице 

    <div id='divContainer1' onmouseover=ShowEditDiv(1) onmouseout=HideEditDiv(1)  class='divClcContainer'>
        <div id='divSlNo1'>1</div>
        <div id='divItem1'>This is content</div>
        <div id='divEditLink1'></div>
    </div>  
    <div id='divContainer2' onmouseover=ShowEditDiv(2) onmouseout=HideEditDiv(2)  class='divClcContainer'>
        <div id='divSlNo2'>2</div>
        <div id='divItem2'>This is content2</div>
        <div id='divEditLink2'></div>
    </div>

и в моем javascript 

function ShowEditDiv(divId)
{
  $("#divEditLink" + divId).html("<a href=\"javascript:Edit(divId)\"><img  src='edit_icon.gif' alt='Edit' title='Edit' /></a>").addClass("divEdit");
}
function HideEditDiv(divId) 
{  
  $("#divEdit" + divId).empty().addClass('divEdit');
}

Мое требование - показывать ссылку для редактирования, когда пользователь наводит указатель мыши на мастер-элемент. Теперь он работает нормально. Но когда я помещаю курсор мыши на элемент div, который содержит редактируемое изображение / ссылку, он исчезает. Я обнаружил, что, когда я помещаю мышь над div редактирования, вызывается функция mouseout родительского div. Может ли кто-нибудь помочь мне решить эту проблему?

Ответы [ 2 ]

5 голосов
/ 08 октября 2009

Решение этой ошибки - использовать события mouseenter и mouseleave вместо mouseover и mouseout.

Подробнее об этом можно узнать по этой ссылке

http://jquery -howto.blogspot.com / 2009/04 / проблемы-с-Jquery-наведения мыши-mouseout.html

1 голос
/ 08 октября 2009

Используйте

stopPropagation в функции дочерних элементов.

Останавливает всплытие события в родительские элементы, предотвращающие любого родителя обработчики от уведомления о событие.

...