如何使用jquery在鼠标上方取消隐藏活动div_Jquery_Html

如何使用jquery在鼠标上方取消隐藏活动div

jquery html

如何使用jquery在鼠标上方取消隐藏活动div,jquery,html,Jquery,Html,我想在上面的鼠标上解开一个div 目前，在我的代码中（见下文）。悬停链接时，将打开advace搜索表单。当用户从url移动鼠标时，打开的表单将关闭。我希望只有当用户移动鼠标时表单才会关闭请提出解决方案 <html> <head> <style> div { background:#dad; font-weight:bold;

我想在上面的鼠标上解开一个div

目前，在我的代码中（见下文）。悬停链接时，将打开advace搜索表单。当用户从url移动鼠标时，打开的表单将关闭。我希望只有当用户移动鼠标时表单才会关闭

请提出解决方案

          <html>
            <head>
              <style>
            div { background:#dad;
            font-weight:bold;
            font-size:16px;
            width: 400px;
            }
            </style>
              <script src="http://code.jquery.com/jquery-latest.js"></script>
            </head>
            <body>
                <a href="">Do advance Search</a>
              <div style="display: none">
                  <h2>Advance Search Form:</h2>
                  <form action="search.php"><br/>
                 <input type="text" name="isbn" placeholder="Enter Isbn"/><br/>
                <input type="text" name="isbn" placeholder=" Title  "/><br/>
                 <input type="text" name="isbn" placeholder="Enter Author First Name"/><br/>
                 <input type="text" name="isbn" placeholder="Enter author last name"/><br/>
                <input type="text" name="isbn" placeholder="Enter Isbn"/>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="Search"/>
              </div>
            <script>
            $("a").hover(function () {
            $("div").toggle("slow");
            });
            </script>

            </body>
            </html>


背景：爸爸；
字体大小：粗体；
字体大小：16px；
宽度：400px；
}
预先查册表格：










$（“a”）.hover（函数（）{
$（“div”）。切换（“慢速”）；
});

为便于在脚本中参考，请更改：

到

并将脚本更新为：

$（“a”）.hover（函数（）{
$（“theForm”）。show（“slow”）；
});
$（“#theForm”）.mouseleave（函数（）{
$（这个）。隐藏（“慢”）；
});

这将使它在鼠标离开框时切换掉div

参考

检查这个，尽管我对代码做了一些调整

$("a").hover(function () {
            $("#searchfrm").show();
});

$("#searchfrm").mouseleave(function(){
    $("#searchfrm").hide();
});

更新为添加关闭按钮

第二次更新

试试这个

 $("a").mouseover(function() {
     $("div").toggle("slow");
 });
$("div").mouseleave(function(){
  $(this).hide("slow");
});

试试这个

$("a").mouseover(function() {
    $("div").show("slow");
});

$("div").mouseleave(function(){
    $(this).hide();
});

谢谢，工作正常。你能告诉我另一种方式吗“如果鼠标悬停在URL上，表单将像上面的代码一样打开保存，但要关闭表单，用户需要单击打开的表单…”。。。。当前，当我将鼠标放在表单上时，您的代码正在关闭我的表单。@我添加了一个关闭按钮。请检查它是否正常工作。但是如果用户将鼠标移出表单，我不想关闭表单。我只想在他们点击表单上的关闭按钮时关闭它。]@lovesangprince这很简单，你应该删除。mouseleave功能。无论如何，我已经更新了我的答案，但只有当我点击url时，它才会打开。我想在（Onclick和鼠标悬停）事件中打开表单。是否可以在单击和鼠标悬停时执行相同的功能？是的，您可以将

$（'a'）。将悬停到$（'a'）。单击即可。但是，如果您希望单击然后将其打开或关闭，还需要将.show（“slow”）
更改为.toggle（“slow”）
。我更新了以供参考。我的意思是“我希望鼠标悬停和鼠标单击具有相同的功能。但是，如果你在悬停和单击两个方面都具有相同的功能，那么你就不需要单击，因为悬停已经显示了它？我不太明白。我希望两个事件功能都用于打开表单，但用于关闭表单，我只希望”关闭“窗体上的按钮。