当我点击按钮时，jQuery模式将不会显示

我试图创建一个模式窗口，当你点击导航栏中的登录按钮时弹出。我已经做到了，所以模式和它的页面叠加在css中都设置为'display: none'。我已经尝试了所有可以让它在点击上显示的方法，但我无法实现它的功能。我试过fadeIn()。我试过.css()来改变它。我甚至尝试只用'display：none'来制作一个特殊的课程，并使用.removeClass()。没有用！当我点击按钮时，jQuery模式将不会显示

这是一个学校作业，所以我不能使用jQuery UI。我并没有要求为我做这件事。我只是想朝着正确的方向轻推。有人能帮我吗？这是我现在的代码。

$(document).ready(function() { 
    $('#login').click(function(event) { 
     event.preventDefault(); 
     $('.overlay').removeClass('.displaynone'); 
     $('.modal').removeClass('.displaynone'); 
    }); 
});

这是一个JS小提琴与整个情况在那里。登录按钮应该在其上面显示覆盖层和模态。我想让它渐渐消失，最好是模态有第二次延迟。

小提琴：https://jsfiddle.net/duagdn8m/1/

来源

2016-02-11 Matt Lee

https://jsfiddle.net/duagdn8m/5/ 只要删除。放在你想删除的类名上。

$('.overlay').removeClass('displaynone'); 
$('.modal').removeClass('displaynone');

来源

2016-02-11 20:41:57 Jeremy

你加入的类名.了。这不是必需的。你不需要.符号在这里：

$('.overlay').removeClass('displaynone'); 
$('.modal').removeClass('displaynone');

小提琴：https://jsfiddle.net/cnye843k/

我建议给人一种absolute作为position荷兰国际集团的登录界面，使它成为一个模式。或者如果你还没有包含CSS，那很好。

来源

2016-02-11 20:32:24

实际上，我发布这个之后我才明白这一点。我无法相信。我昨晚在这一切工作，并无法使其工作。然后我张贴这个并且没有问题地解决它。不过谢谢，我很欣赏这种努力。 –

@MattLee顺便说一下，看看更新......'：）' –

您需要删除removeClass('.displaynone');的.和overlay和modal是类，而不是ids。所以你需要更新你的css到.overlay和.modal。

也，其更轻松地设置overlay和modal到display:none;然后fadeIn两个像这样： - 。

$(document).ready(function() { 
    $('#login').click(function(event) { 
     event.preventDefault(); 
     $('.overlay, .modal').fadeIn(1000) 
    }); 
});

这将使你在1秒淡出

Fiddle

来源

2016-02-11 20:43:55 BenG

当我点击按钮时，jQuery模式将不会显示

回答

相关问题