Question

当我使用javascript添加或删除类时，请重新加载页面..

它不会工作

我尝试了此代码，并将其放在标题的

<script>
    $(document).ready(function() {
  $('.boxAdRight').removeClass('boxAdRight').addClass('active');
});
</script>

这是我的HTML ，我想删除 boxAdRight 类，并使用 .active 类

进行更改

<div class="panel-body">
   <div class="tab-content">
      <div class="tab-pane fade in active" id="data">
         <div class="getData">
            <div class="row">
               <div class="col-md-12 col-sm-12 col-xs-12">
                  <div class="servers">
                     <ul>
                        <li class="active" 
                           id="s_0"onclick="getServer(this.id,0);"> 
                           <i class="fa fa-video-camera"></i> server1
                        </li>
                     </ul>
                  </div>
               </div>
               <div class="col-md-3 col-sm-4 col-xs-12 fRight">
                  <div class="episodes boxAdRight">
                     <h2>episodes</h2>
                     <ul>
                        <li>
                           <a href="http://localhost/wordpress/newarticle13/">                                  episode 1</a>
                        </li>
                        <li class="active"><a href="http://localhost/wordpress/newarticle13/"> episode 2</a>
                        </li>
                     </ul>
                  </div>
               </div>
               <div class="col-md-9 col-sm-8 col-xs-12 fRight">
                  <div class="boxVideos">
                     <div class="getCode"><iframe src="https://*******" scrolling="no" frameborder="0" width="700" height="430" allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

谢谢

Answer 1

作为第一个观察，我想提到一个事实，即JQuery的removeClass函数返回一个或多个用空格分隔的类名称，应将其删除。因此，您不应将addClass应用于removeClass的结果。

虽然您的代码中可能还存在其他问题...

Answer 2

将您的.boxAdRight类替换为.episodes类，它将根据需要工作。

  <script>
        $(document).ready(function() {
            $(".episodes").removeClass("boxAdRight").addClass("active");
       });
    </script>

Answer 3

我认为方法调用的顺序应为

    private void TabControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        int tabItem = ((sender as TabControl)).SelectedIndex;
        if (e.Source is TabControl) // This is a soultion of those problem.
        {
            switch (tabItem)
            {
                case 0:
                       //something
                       break;
                case 1:
                       //something
                       break;
            }
    }

在原始示例$('.boxAdRight').addClass('active').removeClass('boxAdRight');中，使用了选择器$('.boxAdRight').removeClass('boxAdRight').addClass('active');，但是随后该类被.boxAdRight删除，因此在选择器上调用.removeClass('boxAdRight')没有匹配的元素。

Answer 4

像这样得到它会解决

$('.episodes').addClass('active').removeClass('boxAdRight');

在通常情况下，您也必须工作吗？

Answer 5

您还可以通过替换类而不是删除它来简化此代码。

$（'。boxAdRight'）。className ='active';

how to replace class HTML name with javascript

在页面加载问题上使用javascript删除并添加类

5 个答案: