单击<div>打开Drop Down在IE和FireFox </div>中不起作用

时间:2013-06-26 11:51:57

标签: jquery cross-browser

我有一个jquery功能,我可以点击它,它会带来一个Drop Down。一切都很好,但这不适用于IE和Firefox。当我点击没有任何事情发生或没有下降出现。

以下是Js Fiddle的例子:http://jsfiddle.net/LwLsZ/

没有办法解决这个问题。如果任何专家可以解决问题那将是伟大的

HTML

<div id="gear">
Click Me

<div id="dropdown">  </div>

</div>

的CSS

#gear {
margin: 100px;
width: 100px;
height: 30px;
border: 1px solid;
position: relative;
}

#dropdown {
position: absolute;
top: 30px;
right: -1px;
width: 150px;
height: 100px;
border: 1px solid;
display: none;
}

jquery的

$(function(){

$('html').click(function(){
    if($('#dropdown').is(':visible')){
       $('#dropdown').hide(); 
    } 
});

$('#gear').click(function(){
   event.stopPropagation();
   $('#dropdown').toggle(); 
});

 });

3 个答案:

答案 0 :(得分:4)

您缺少事件侦听器的event参数。将您的jQuery代码更改为

$(function(){
    $('html').click(function(event){
        if($('#dropdown').is(':visible')){
           $('#dropdown').hide(); 
        } 
    });

    $('#gear').click(function(event){
       event.stopPropagation();
       $('#dropdown').toggle(); 
    });
});

它应该有效。我forked your jsfiddle来演示它。

答案 1 :(得分:0)

stopPropagation更改为return false并将其放在切换后:

http://jsfiddle.net/LwLsZ/1/

答案 2 :(得分:0)

将其更改为:

$(function(){

 $(document).click(function(){
   if($('#dropdown').is(':visible')){
    $('#dropdown').hide(); 
   } 
 });

 $('#gear').click(function(e){
   e.stopPropagation();
   $('#dropdown').toggle(); 
 });

});

$(document)注意它可以在IE中使用