jQuery hover不停地发射

jQuery hover keeps firing non-stop

本文关键字：发射 hover jQuery      更新时间：2023-09-26

我有一个表单，我想让它被"覆盖"，直到用户将鼠标移到它上面。为了做到这一点，我有一个div，它通过z-index和绝对定位放置在表单的顶部，当用户将鼠标悬停在它上面时，它将被隐藏，使表单可见。

形式:

<div class='container'>
    <div id='form-cover' class='form-cover'>
        <div id='sign-up'>Sign up today!</div>
    </div>
    <form id='register' class='form' method='POST' action='#'>
        <label for='first-name'>First Name: </label>
        <input id='first-name' type='text' length='50'>
        <br />
        <label for='last-name'>Last Name: </label>
        <input id='last-name' type='text' length='50'>
        <br />
        <label for='address'>Address: </label>
        <input id='Address' type='text' length='50'>
    </form>
</div>
jQuery: 

$('#form-cover').hover(function(){
    $(this).hide();
    },function(){
        $(this).show();
});

目前，当我将鼠标移动到#form-cover上时，覆盖div保持隐藏，然后反复显示自己，当我只打算让它隐藏自己，并在用户的鼠标离开表单时再次显示自己。

What i've try 

$('#form-cover').mouseenter(function(){
    $(this).hide();
    //$('#form-cover').removeClass('form-cover');
});
$('#form-cover').mouseleave(function(){
    $(this).show();
    //$('#form-cover').addClass('form-cover');
});

以及链接mouseenter和mouseleave在一起，但似乎没有工作。

任何帮助将非常感激!

小提琴可以在这里找到http://jsfiddle.net/KXW72/

这是因为您的表单覆盖隐藏，从而触发鼠标离开。

试题:

$('#form-cover').mouseenter(function() {
   $(this).hide(); 
});
$('#business').mouseleave(function() {
   $('#form-cover').show(); 
});
http://jsfiddle.net/KXW72/1/

相关文章：