Jquery 代码在 Chrome 中工作，但在 Firefox 中不工作答案

【问题标题】：Jquery code working in Chrome but not in FirefoxJquery 代码在 Chrome 中工作，但在 Firefox 中不工作
【发布时间】：2010-01-05 00:55:19
【问题描述】：

我有这段代码，当它被点击时会显示几个 div，然后在点击另一个链接时它们会被隐藏。我正在尝试让它在 Firefox 中显示，它在 js 中可能不是问题，但非常感谢所有帮助。

<script type="text/javascript">
    $(document).ready(function(){
            $('.fadein').click(function(){
                    // Make the id overview show
                    $('#header-contact').hide('slow'); 
                    $('#header-portfolio').show('slow');
                    $('#content-portfolio').show('slow');
                    // override default a behavior
                    return false;
            });
    });
</script>
<script type="text/javascript">
    $(document).ready(function(){
            $('.fadein2').click(function(){
                    // Make the id overview show
                    $('#header-portfolio').hide('slow');                       
                    $('#header-contact').show('slow');
                    $('#content-portfolio').hide('slow');
                    // override default a behavior
                    return false;
            });
    });

</script>
<script type="text/javascript">
    $(document).ready(function(){
            $('.fadein3').click(function(){
                    // Make the id overview show
                    $('#header-portfolio').hide('slow');                       
                    $('#header-contact').hide('slow');
                    $('#content-portfolio').hide('slow');
                    // override default a behavior
                    return false;
            });
    });

【问题讨论】：

在 Firefox 中进行测试的链接会有所帮助。您是否尝试过使用 FireBug 测试 Javascript 错误？那里的一切看起来都不错。
是的，尝试使用 Firebug 并没有出现任何错误，将所有代码添加到我的站点中会有帮助吗？然后有可能看看是我用 CSS 还是 HTML 出了问题。
你没有关闭第三个脚本元素，是错字吗？还是问题的原因？

标签： jquery firefox google-chrome animation

【解决方案1】：

尝试将event 传递给每个click 处理程序，在return false 之前，对传入的event 对象调用preventDefault()。

示例：

$(document).ready(function(){
        $('.fadeinX').click(function(e){
                // Make the id overview show
                $('#header-portfolio').hide('slow');                       
                $('#header-contact').hide('slow');
                $('#content-portfolio').hide('slow');
                // override default a behavior
                e.preventDefault();
                return false;
        });
});

【讨论】：

【解决方案2】：

使用Web Developer by Chris Pederic 清除缓存。我在使用 Firefox 时遇到了完全相同的问题，并且使用 Web 开发人员清除缓存解决了它。很简单，但你永远不会知道，而且我一直在拔头发。

【讨论】：

我下载了 Web 开发工具，但随后我在另外 2 台计算机上检查了该问题。他们都在 Chrome 和 IE（不确定 safari）中运行脚本，但在 Firefox 中却没有。不过感谢您的帮助。

【解决方案3】：

如果你preventDefault();，你实际上根本不需要return false

 $(document).ready(function(){
   $('.fadein').click(function(e){
     // Make the id overview show
     $('#header-portfolio').hide('slow');                       
     $('#header-contact').hide('slow');
     $('#content-portfolio').hide('slow');
     // override default a behavior
     e.preventDefault();
   });
 });

还将您的 JS 移动到它自己的文件中，并且只有一个 $(document).ready(function() {...}) 函数，您可以将所有三个事件都放在那里。

【讨论】：