JQuery функция парения вызывает мой ДИВ, чтобы скрыть

Question

В моем functions.js у меня есть:

$(document).ready(function() {  
    $("#cat").hover(function() { 
    $("#kiti").show(); 
    }) 
    $("#kiti").mouseout(function() { 
    $("#kiti").hide();  
    })         
}) 

Html файл:

<a id="cat" href="#">category</a> 
<div id="kiti"> 
    <a href="#">sub1</a> 
    <br /><a href="#">sub2</a> 
</div> 

Почему, когда я наведите курсор мыши на SUB1, SUB1 и SUB2 шкуры? Если это простой текст, все в порядке. Надеюсь, у вас есть мой вопрос.

Редактировать: Кстати. Есть ли способ сделать что-то вроде die(); или exit(); с php в javascript, чтобы остановить выполнение?

Answer 1

$.hover() принимает два аргумента. Если вы просто хотите использовать первый, используйте вместо этого $.mouseover().

$(function(){ 
    $("a#cat").mouseover(function(){ 
    $("#kiti").show(); // shows <div id="kiti">...sub1...sub2...</div> 
    }); 
    $("#kiti").mouseleave(function(){ 
    $(this).hide(); // hides <div id="kiti">...sub1...sub2...</div> 
    }); 
}); 

Answer 2

mouseout является неправильным событие - это срабатывает при наведении над дочерним элементом.
Использование mouseleave вместо:

$("#cat").mouseenter(function() { 
    $("#kiti").show(); 
}); 
$("#kiti").mouseleave(function() { 
    $("#kiti").hide();  
}); 

Посмотри здесь: http://jsbin.com/irexo
Документация здесь: http://docs.jquery.com/Events/mouseout