Javascript 仅在FireFox中工作的jQuery.hover（）

我需要在几个菜单项中添加信息性弹出窗口，我使用jQuery.hover来实现。然而，这只适用于Firefox，不适用于Safari、Chrome或Opera

var Main = function() {

    //other functions...

    function _setPopups() {
        $(".dt_event_title a").hover(
            function(){
                $(".info_popup",this).css({"display":"block"});
                //$(".info_popup",this).fadeTo("normal",1);
                //$(".info_popup",this).fadeIn("normal");
                //$(this).find(".info_popup").fadeIn("normal");

            },
            function(){
                $(".info_popup",this).css({"display":"none"});
                //$(".info_popup",this).fadeTo("normal",0);
                //$(".info_popup",this).fadeOut("normal");
                //$(this).find(".info_popup").fadeIn("normal");
            }
        );
    }
    return {
        //other methods...
        "setPopups" : function(){ _setPopups(); }
    };
}();
$(document).ready(function(){
    //other method calls...
    Main.setPopups();
});

我的其他方法在上下文中工作，因此我的闭包很好。注释掉的jQuery行表示我尝试过的其他转换，这些转换产生了相同的结果：在Firefox中工作，但在其他转换中不工作。我不确定我做错了什么

仅供参考.info_popup div有一个css样式的显示：在外部样式表中无可隐藏

任何帮助都将不胜感激

***这里是一些html。。。注意，这表示输出，html主要由php生成

<tr class="dt_event_title">
   <td>
      <a class="dt_event_link" href="...php generated link...">
         <span class="info_icon"></span>
         <span class="event_title">Title of Event</span>
      </a>
      <div class="info_popup">   
         ...some php generated content
      </div>
      <div class="dt_event_date">
          09-15-2010 02:00 pm - 02:00 pm          
      </div>
   </td>
</tr>

还是同样的问题。

（编辑为使用html）

由于您正在指定选择器上下文（将此添加到选择器中），因此.info_弹出元素必须位于该元素的内部。注意info_popup div是如何位于a元素内部的。我不确定这是你想要的，但它符合你的代码由于您的信息弹出窗口位于a元素之外，请使用

$（this）.parent（）

作为选择器。

我把这个扔进了一个盒子给你。我在Chrome中使用它，它可以工作

代码如下：

HTML

JS

---

相关的HTML是什么样子的？具体来说，这些

元素中有什么？请特别注意，像

这样的块级元素不能嵌套在

标记中，因此这可能是IE告诉您标记无效的方式。我不知道有什么问题，只是想让您知道，与其执行

.css（{“display”：“none”}）

和

.css（{“display”：“block”}），不如执行
.css（{“display”：“block”}）
您可以使用
.show（）
和
.hide（）
执行完全相同的操作：如果你不知道的话，对你来说就容易一点。jquery位看起来都很好。。。我不知道您在jquery方面做了什么，但是jquery应该可以工作。也许在奇特的嵌套函数之外编写它，看看它是否有效——至少这样你就知道它是jquery还是javascript了。我确实在我的a标记中有块级元素，但是即使在重新构造之后，这样里面就没有div标记了，行为还是一样的。。。说清楚点，这不是问题所在。除了Firefox之外，没有其他浏览器可以使用。谢谢你的建议，Thomas。我也尝试了show（）和hide（）（我尝试了几个选项）。我还将代码放在我的闭包之外以检查这一点。两者都给出了相同的结果。你能包括相关的HTML，特别是菜单和弹出窗口吗？谢谢。我已经尝试了你的建议，结果仍然一样。我已经尝试了很多不同的选择方式，除了Firefox，似乎没有一种能在其他任何地方工作。。。我要去nuts@Logic，我发布的使用html摘录的JSFIDLE对您有用吗？因此，您的html或js中存在差异。您是否查看了控制台以查找js错误？我已经通过jslint运行了它，并通过firebug控制台和chrome的控制台查看了它…没有js错误。您是否完全确定相关部分与JSFIDLE相同？这是您可以链接到的面向公众的页面吗？
<tr>
   <td>
      <div class="dt_event_title">
         <a class="dt_event_link" href="php generated link">
            <span class="info_icon"></span>
            <span class="event_title">php generated title</span>
         </a>
         <div class="dt_event_date">php generated date</div>
         <div class="info_popup">
            <div class='popup_title'>php generated title</div>
            <div class='popup_date'>php generated date</div>
            <div class='popup_time'>php generated time</div>
            <div class='popup_arrow'></div>
         </div>
      </div>
   </td>
</tr>

var Main = function() {

    function _setPopups() {
        $(".dt_event_title").hover(
            function(){
                $(".info_popup",$(this)).fadeIn("fast");
            },
            function(){
                $(".info_popup",$(this)).fadeOut("fast");
            }
        );
    }
    return {
        "setPopups" : function(){ _setPopups(); }
    };
}();
$(document).ready(function(){
    Main.setPopups();
});

<table>
<tr class="dt_event_title">
   <td>
      <a class="dt_event_link" href="...php generated link...">
         <span class="info_icon"></span>
         <span class="event_title">Title of Event</span>
      </a>
      <div class="info_popup">   
         ...some php generated content
      </div>
      <div class="dt_event_date">
          09-15-2010 02:00 pm - 02:00 pm          
      </div>
   </td>
</tr>
</table>​

.info_popup { display:none; }​

var Main = function() {

    //other functions...
    function _setPopups() {
        $(".dt_event_title a").hover(
            function(){
                $(".info_popup",$(this).parent()).show(); //switched to .show() and $(this).parent()
                //$(".info_popup",this).fadeTo("normal",1);
                //$(".info_popup",this).fadeIn("normal");
                //$(this).find(".info_popup").fadeIn("normal");

            },
            function(){
                $(".info_popup",$(this).parent()).hide(); //switched to .hide() and $(this).parent()
                //$(".info_popup",this).fadeTo("normal",0);
                //$(".info_popup",this).fadeOut("normal");
                //$(this).find(".info_popup").fadeIn("normal");
            }
        );
    }
    return {
        //other methods...
        "setPopups" : function(){ _setPopups(); }
    };
}();
$(document).ready(function(){
    //other method calls...
    Main.setPopups();
});​