Jquery 单击事件时解除鼠标悬停事件_Jquery_Events_Mouseevent

Jquery 单击事件时解除鼠标悬停事件

jquery events

Jquery 单击事件时解除鼠标悬停事件,jquery,events,mouseevent,Jquery,Events,Mouseevent,嗨，我这里有下面的代码我有div card-208点击我不想显示div显示div但在鼠标上我想显示它会有一些延迟但不是点击 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">

嗨，我这里有下面的代码我有div card-208点击我不想显示div显示div但在鼠标上我想显示它会有一些延迟但不是点击

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js" type="text/javascript"></script>
<style type="text/css">
.card {
 border:1px solid transparent;
 cursor:pointer;
 float:left;
 height:50px;
 margin:10px;
 padding:3px;
 width:50px;
 background:#000;
 color:#fff;

}
.ui-corner-all {
 -moz-border-radius:4px 4px 4px 4px !important;
}
</style>
</head>
<body>
<!--  <div id="popupContact"  style="position:absolute;left:100px;top:100px;width:100px;height:50px;background-color:orange;border:1px solid red ;">
 </div> -->
<div class="card  ui-corner-all" id="card-208">   
 <div class="card-name">    Rahul1's Gib 1       </div>   
</div>
'<div id="divtoshow" style="display:block;background-color:green; border:1px solid black;width:200px;height:100px;position:absolute;">
  dsfdssd <a href="#">rahul</a>
 </div>

</body>
</html>
<script  type='text/javascript'>
$(document).ready(function(){
 var popup_pos=$('#card-208').offset();
 var timer;
 $("#card-208").bind('mouseover',{},function() {

      setTimeout(function() {
   $("#divtoshow").show();
  }, 1000);
  }); 
 $("#card-208").bind('click',{},function() {
  $("#card-208").unbind('mouseover');
      alert('click event is triggered');





  }); 

 $("#divtoshow").bind('mouseleave',{} ,function() { 
      $("#divtoshow").hide();
  });
});
</script>


.卡片{
边框：1px实心透明；
光标：指针；
浮动：左；
高度：50px；
利润率：10px；
填充：3倍；
宽度：50px；
背景：#000；
颜色：#fff；
}
.ui角所有{
-moz边界半径：4px4px4px4px！重要；
}
Rahul1的Gib 1
'
dsfdssd
$（文档）.ready（函数（）{
var popup_pos=$（'#card-208'）.offset（）；
无功定时器；
$（“#card-208”）.bind（'mouseover'，{}，function（）{
setTimeout（函数（）{
$（“#divtoshow”）.show（）；
}, 1000);
}); 
$（“#card-208”）.bind（'click'，{}，function（）{
$（“#card-208”）.unbind（'mouseover'）；
警报（“触发点击事件”）；
}); 
$（“#divtoshow”）.bind（'mouseleave'，{}，function（）{
$（“#divtoshow”）.hide（）；
});
});

这就是你想要的吗

show_timeout = false;
$(".card")
  .mouseover(function() {
    show_timeout = window.setTimeout(function() {
      $("#divtoshow").show(500);
    }, 1000);
  })
  .click(function() {
    window.clearTimeout(show_timeout);
  });

我会在id=“card-208”上添加“onmouseover事件”和“onclick事件”


函数displaydiv（）
{
$（'#divtoshow'）.css（'display'，'block'）；
}
函数hidediv（）
{
$（'#divtoshow'）.css（'display'，'none'）；
}

     <div class="card  ui-corner-all" id="card-208" onmouseover="displaydiv()"
     onclick="hidediv()"> </div>

     <script>
     function displaydiv()
     {
     $('#divtoshow').css('display','block');
     }

     function hidediv()
     {
     $('#divtoshow').css('display','none');
     }
     </script>