将单击转换为onmouseover javascript_Javascript_Html_Css

将单击转换为onmouseover javascript

javascript html css

将单击转换为onmouseover javascript,javascript,html,css,Javascript,Html,Css,我想将click事件更改为onmouseover事件以打开my div，然后如果鼠标再次向左移动my div隐藏，如下拉菜单，请任何人帮助我 HTML代码： <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Papermashup.com |

我想将click事件更改为onmouseover事件以打开my div，然后如果鼠标再次向左移动my div隐藏，如下拉菜单，请任何人帮助我

HTML代码：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Papermashup.com | Sliding Div</title>
<script src="jquery.js" type="text/javascript"></script>
<script src="dropdown/drop.js" type="text/javascript"></script>
<link type="text/css" href="dropdown/drop.css" rel="stylesheet"/>

</head>

<body>
 <a href="#" class="show_hide" onmouseover="this.#" >Show/hide</a><br />
    <div class="slidingDiv" style="width:103px;height:60px;">
        <img alt="" height="80" src="images/dropdown.png" width="103">
    </div>
</body>
</html>

JavaScript代码：

$(document).ready( function() {

    $(".slidingDiv").hide();
    $(".show_hide").show();

    $('.show_hide').click( function() {
         $(".slidingDiv").slideToggle();
    });

});

试一试

只需使用绑定而不是单击绑定

$('.show_hide').mouseover(function(){
    $(".slidingDiv").slideToggle();
}).mouseout(function(){
    $(this).slideToggle();
});

是什么阻止您将

onmouseover

事件更改为

onclick

？@mohammdreza:为什么不能直接使用onclick？如果你非常想要它，那么你可以使用event.initMouseEvent（）来模拟一个点击事件来代替mouseover。实际上我想用它创建一个下拉菜单，所以我想在鼠标移动到我的按钮上时显示div，在鼠标左移时隐藏div。谢谢你，伙计，如果鼠标左键再次隐藏有什么解决方案吗？谢谢你，伙计，如果鼠标左键再次隐藏有什么解决方案吗？我想创建一些类似于下拉菜单的东西来编辑我的答案，以显示实际的绑定。

 $(".show_hide").mouseenter(function() {
       $(".slidingDiv").slideToggle();
  })

$('.show_hide').mouseover(function(){
    $(".slidingDiv").slideToggle();
}).mouseout(function(){
    $(this).slideToggle();
});