Question

我正在寻找CMS网站上一些小事做的帮助。

我想知道，如果可能的话，如何从一个div中移除或隐藏样式，而另一个div处于活动状态，并且仅当第二个div在第一个div内时。

我正在使用easytabs jQuery插件，easytabs html代码插入了tinymce WYSIWYG HTML源代码编辑器，而<div class="block"></div>是从CMS生成的，因为它是内容模块的包装。

让我告诉你我的代码所以也许你可以更多地了解我想要做的事情：

<div class="block">
<div id="tab-container" class="tab-container">
  <ul class='etabs'>
    <li class='tab'><a href="#tabs1-html">HTML Markup</a></li>
    <li class='tab'><a href="#tabs1-js">Required JS</a></li>
    <li class='tab'><a href="#tabs1-css">Example CSS</a></li>
  </ul>
  <div id="tabs1-html">
    <h2>HTML Markup for these tabs</h2>
    <!-- content -->
  </div>
  <div id="tabs1-js">
    <h2>JS for these tabs</h2>
    <!-- content -->
  </div>
  <div id="tabs1-css">
    <h2>CSS Styles for these tabs</h2>
    <!-- content -->
  </div>
</div>
</div>

<div class="block">
  <div class="test">
  </div>
</div>

好的，所以CMS正在添加带有样式的<div class="block"></div>

（那是样式）：

#main .block {
    border: 2px solid #e0e0e0;
    padding: 24px 28px 24px 26px;
    margin: 0 0 8px;
    background: #ffffff;
    text-align: justify;
    overflow: auto;
}

这就是问题所在。我希望仅在此div <div class="block"></div>内<div id="tab-container" class="tab-container"></div>时删除或隐藏此<div class="block"></div>元素中的样式。

当我在其中有其他div时，我需要保留<div class="block"></div>的所有样式。

是否可以使用某些jQuery或JS？或者这不可能？

提前致谢。

Answer 1

您可以使用jQuery中的has()函数执行此操作。您将不得不重置或更改每个CSS值

＆＃13;

$(document).ready(function() {
  $('.block').has('#tab-container.tab-container').css('border', '0');
});

＆＃13;

.block {
  border: 2px solid red;
  margin-bottom: 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block">
  <div class="some_tag">
    Text
  </div>
</div>

<div class="block">
  <div id="tab-container" class="tab-container">Some more text</div>
</div>

＆＃13;

如果有多个需要像这样改变的话，你也可以做一个CSS值数组：

.css({ "border": "0", "background": "blue"})

Answer 2

坚持重置或覆盖所有块类可能会更容易添加：

$(document).ready(function () {
           $('.block').has('div.tab-container').removeClass('block');
        });

这样你就会删除块类，所以没有样式。

<强> JSFIDDLE

如果其他div的样式处于活动状态，则从一个div中删除样式

2 个答案: