Fatal编程技术网
  • jquery/
  • jquery onblur菜单隐藏在firefox中有效，而不是在chrome中

jquery onblur菜单隐藏在firefox中有效，而不是在chrome中

jquery events firefox google-chrome

jquery onblur菜单隐藏在firefox中有效，而不是在chrome中,jquery,events,firefox,google-chrome,onblur,Jquery,Events,Firefox,Google Chrome,Onblur,您好，我有一些代码，单击按钮时会显示下拉菜单： 问题是这个下拉列表在Firefox中完全消失了，但在Chrome中却没有。我不确定它是否重要，但它基本上是一个工具栏，z-index值约为100。这是实际页面，脚本包含jQuery和一些插件src'ed，其余的->我编写的实际代码…（我知道它在IE中不起作用，但在Chrome中，搜索栏左侧按钮的onblur不起作用，但它在FF5中起作用，因此它也必须在较低的FF中起作用 非常感谢您的帮助：D <html> <head>

您好，我有一些代码，单击按钮时会显示下拉菜单：

问题是这个下拉列表在Firefox中完全消失了，但在Chrome中却没有。我不确定它是否重要，但它基本上是一个工具栏，
z-index
值约为
100
。这是实际页面，脚本包含jQuery和一些插件src'ed，其余的->我编写的实际代码…（我知道它在IE中不起作用，但在Chrome中，搜索栏左侧按钮的
onblur
不起作用，但它在FF5中起作用，因此它也必须在较低的FF中起作用

非常感谢您的帮助：D



<html>
<head>
<title>the title</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script>
<script type="text/javascript">
$(function(){
$('#friend-requestButton').click(function () {
    if ($('#friend-requestMenu').css('display') == 'none') {
        $('#friend-requestMenu').css('display', 'block').show('slide', { direction: 'up' }, 200);
    }
    else {
        $('#friend-requestMenu').css('display', 'none').hide("fold", {}, 1000);
    }
});
$(this).blur(function () {
    $('#friend-requestMenu').css('display', 'none').effect('fade');
});
});
</script>
</head>
<body>
<button id="friend-requestButton" class="ui-button-icon-only ui-corner-all ui-state-default"></button>

<!--button end-->

<!--Menu markup below-->

<div id="friend-requestMenu">
    <div class="menuTitle">
        Friend Requests <a href='javascript:void(0)' class="titleLink">See All</a>
    </div>
    <a href='javascript:void(0)' class="menu_item">Menu Item</a>
    <a href='javascript:void(0)'>
        <div class="seeAllBlock">
            See All Requests
        </div>
    </a>
</div>
</body>
</html>


标题
$（函数（）{
$（“#朋友请求按钮”）。单击（函数（）{
if（$（“#朋友请求菜单”）.css（'display'）=='none'）{
$（#friend requestMenu'）.css（'display'，'block'）.show（'slide'，{direction:'up'，200）；
}
否则{
$（'#friend requestMenu'）.css（'display'，'none'）.hide（'fold'，{}，1000）；
}
});
$（this）.blur（函数（）{
$（'#friend requestMenu'）.css（'display'，'none'）.effect（'fade'）；
});
});
好友请求
这段代码在Google Chrome中适用于我。 我从研究中发现，JQuery中不存在您的.effect（'fold'）。您使用'fold'的方式是在.hide/.show中，就像我在编辑代码时一样：

$（'#朋友请求菜单'）.css（'display'，'none'）.hide（“fold'，{}，1000）

以下是显示此功能的链接：

您可能还想重写.effect（'fade'），因为我只在JQuery API上看到这些效果：.fadeIn（）、.fadeOut（）、.fadeTo（）和.fadeToggle（）：

这是我的第一篇帖子，如果我错了，请告诉我。这个解决方案在Chrome中对我有效

有任何问题，请告诉我。
谢谢，

@匿名匿名匿名我很抱歉再也没有回复你，我相信你已经开始做更大更好的事情了，但我想把这个答案放在这里，供将来可能偶然发现这条线索的人参考

 <script type="text/javascript">
 $(function(){
      $('#friend-requestButton').click(function () {
           if ($('#friend-requestMenu').css('display') == 'none') {
                $('#friend-requestMenu').show(1000);
           }
           else {
                $('#friend-requestMenu').hide(1000);
           }
      });
 });
 </script>


$（函数（）{
$（“#朋友请求按钮”）。单击（函数（）{
if（$（“#朋友请求菜单”）.css（'display'）=='none'）{
$（“#朋友请求菜单”）.show（1000）；
}
否则{
$（“#朋友请求菜单”）.hide（1000）；
}
});
});
这是我今天在Chrome中正确使用的经过编辑的代码。使用.show（#）和.hide（#）方法可以创建不同速度的模糊效果，等等

我希望这有帮助。
谢谢。

hi sgtbigman，谢谢你的帮助，但我试过代码，似乎不起作用。我也试过删除所有效果，但仍然一点都不模糊……它在firefox上运行良好，我没有为ie设计，所以无从得知（css都乱了），我听说必须添加tabindex=0属性才能使其工作不太确定…@anonymouslyanonymous如果您感到好奇，我找到了解决此问题的方法。我为我的答复太晚而道歉。 
<html>
<head>
<title>the title</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script>
<script type="text/javascript">
$(function(){
$('#friend-requestButton').click(function () {
    if ($('#friend-requestMenu').css('display') == 'none') {
        $('#friend-requestMenu').css('display', 'block').show('slide', { direction: 'up' }, 200);
    }
    else {
        $('#friend-requestMenu').css('display', 'none').hide("fold", {}, 1000);
    }
});
$(this).blur(function () {
    $('#friend-requestMenu').css('display', 'none').effect('fade');
});
});
</script>
</head>
<body>
<button id="friend-requestButton" class="ui-button-icon-only ui-corner-all ui-state-default"></button>

<!--button end-->

<!--Menu markup below-->

<div id="friend-requestMenu">
    <div class="menuTitle">
        Friend Requests <a href='javascript:void(0)' class="titleLink">See All</a>
    </div>
    <a href='javascript:void(0)' class="menu_item">Menu Item</a>
    <a href='javascript:void(0)'>
        <div class="seeAllBlock">
            See All Requests
        </div>
    </a>
</div>
</body>
</html>

 <script type="text/javascript">
 $(function(){
      $('#friend-requestButton').click(function () {
           if ($('#friend-requestMenu').css('display') == 'none') {
                $('#friend-requestMenu').show(1000);
           }
           else {
                $('#friend-requestMenu').hide(1000);
           }
      });
 });
 </script>