Question

我有一个div

<div id="commonConsultationPopup" class="overlayPopup"></div>

我想在页面加载时删除类。

我试过了：

$(document).ready(function() {
$("#commonConsultationPopup").removeClass("overlayPopup");
});

但它不起作用。

Answer 1

试试这个：

$(document).ready(function() {
    $("#commonConsultationPopup").removeClass();
});

但它将删除给定div中的所有类。

Answer 2

我不相信这个功能符合你的想法。从手册：

removeclass（类名）

类型：字符串

要从每个匹配元素的类属性＆gt;中删除一个或多个以空格分隔的类。

请注意，手册说它会从类属性中删除类。不表明它将删除整个元素。

如果您想删除整个div，则需要.remove()功能。要使用此功能，请使用finder查找div（可能按类名？），然后在其上调用remove()。

Answer 3

试试此代码

<html>
   <head>
      <script type = "text/javascript" 
         src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
      <script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
            $("#commonConsultationPopup").removeClass("overlayPopup");
         });
      </script>
   </head>
   <body>
      <div id="commonConsultationPopup" class="overlayPopup"></div>
   </body>
</html>

结果

不要查看来源。查看Firebug或类似内容。

Answer 4

要删除文档就绪的类，请使用此JS：

jQuery(document).ready(function() {
  $("#commonConsultationPopup").removeClass("overlayPopup");
});

要从窗口加载的元素中删除类，请改为使用：

jQuery(window).load(function() {
  $("#commonConsultationPopup").removeClass("overlayPopup");
});

以下是完整的代码：

<!DOCTYPE html>
<html>
<head>
  <title>Remove class example</title>
  <!-- We are using jQuery 3.1.0 -->
  <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
  <!-- You can also use jQuery 12.1.4 like this -->
  <!-- <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script> -->
</head>
<body>
  <div class="overlayPopup" id="commonConsultationPopup"></div>
  <script type="text/javascript">
    // Use this if you want to wait for the page to be ready:
    jQuery(document).ready(function($) {
      $("#commonConsultationPopup").removeClass("overlayPopup");
    });
    // Use this instead if you want to wait for the page to load:
    // jQuery(window).load(function() {
    //   $("#commonConsultationPopup").removeClass("overlayPopup");
    // });
  </script>
</body>
</html>

祝你好运，一切顺利。

Answer 5

代码100％工作如果不起作用，请在此处查看演示，颜色应为红色。但这并不意味着班级被删除了。您也可以通过按F12检查代码以查看代码。

＆＃13;

$(document).ready(function() {
  $('#commonConsultationPopup').removeClass('overlayPopup');
});

＆＃13;

.overlayPopup{
  color:red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="commonConsultationPopup" class="overlayPopup"> The class removed </div>

＆＃13;

Answer 6

你的JS看起来很完美，只需检查两件事

jQuery已加载。
将“$”替换为“jQuery”特别是在使用WordPress时。

HTML

<div id="commonConsultationPopup" class="overlayPopup">test</div>

JS

jQuery(document).ready(function() {
    jQuery("#commonConsultationPopup").removeClass("overlayPopup");
});

Check This Working CODEPEN

在页面加载时删除div类

6 个答案: