Question

编辑：我解决了我的问题，显然找不到jQuery 2.1.4.js。 #stupidmistakesthatyouoverlook感谢所有响应和帮助的人！这非常有用！

问题

我想要一个链接从div中删除一个类，以便根据情况显示内容和淡入或淡出;但是，我的代码（如下所示）没有完成任务，我不知道为什么？任何想法？

我的代码

假设我有一个包含nav.jade和about.jade的index.html。作为参考，我使用的是Jekyll。

（nav.jade）

section.nav 
ul#navList
    li
        a(href="#")#video-link
            i.fa.fa-youtube-play
            |  Music Video

（about.jade）

.video-overlay.hide
  .video-container 
     <iframe width="853" height="480" src="https://www.youtube.com/embed/EN5xqCNbf9c" frameborder="0" allowfullscreen></iframe>

     a(href="#").hide-cta Close this Video

（about.sass）

.video-overlay
  display: flex
  justify-content: center
  align-items: center

  position: fixed
  left: 0
  right: 0
  top: 0
  bottom: 0
  background-color: rgba(0, 0, 0, 0.5)
  z-index: 50

.video-container
  width: 853px
  height: 480px
  background-color: black
  padding: 5px

.hide-cta
  position: absolute
  top: 80%
  left: calc(50% - 85px)
  text-align: center
  text-decoration: none
  padding: 5px 10px
  color: white
  border: 2px solid white
  transition: all 0.3s ease-in-out

  margin-top: 30px

  &:hover
     color: black
     background: white
     border: 2px solid white

.hide
   display: none

（functions.js）

$(function() {//shorthand for $('document').ready(function () {}

       $('#video-link').on('click', function() { //check if link was clicked
            $('.video-overlay').removeClass('.hide'); //unhide the div
            $('.video-overlay').fadeIn('slow'); //fade the div in
            return false; //if it wasn't clicked return false
       });

       $('#hide-cta').on('click', function() { //check if link was clicked
            $('.video-overlay').addClass('.hide'); //make the div hide itself
            $('.video-overlay').fadeOut('slow'); //fade the div out
            return false; //if it wasn't clicked return false 
       });
});

Answer 1

这是许多人偶然发现的常见语法错误。我过去也犯了罪。不要在addClass和removeClass函数调用中使用用户选择器。只需使用班级名称。

所以这些电话看起来应该是

$('.video-overlay').removeClass('hide'); //unhide the div

和

$('.video-overlay').addClass('hide'); //make the div hide itself

分别

如何使用jQuery创建一个从div中删除类的链接？

1 个答案: