Question

有没有办法将类附加到当前的类名？

<li class="myWrap"></li>

然后onClick切换课程：

$('.myWrap').toggleClass('selected');

无论如何，我可以阅读当前的课程，我已选择并将其添加到我添加的课程中。所以我的新班而不是：

<section class="myWrap selected"></section>

它将是：

<section class="myWrap myWrap_selected"></section>

Answer 1

.toggleClass()已经可以为你做这个了，但你需要一种方法来确定基类，因为在任何给定的点你的元素可以有多个类（基类，选定的类和任何其他类））。如果确保基类仍然是第一个指定的基类，则可以使用以下内容。

$('li').on('click', function() {

    // find the base class
    var baseClass = $(this).attr('class').split(' ')[0];

    // toggle the selected class
    $(this).toggleClass(baseClass + '_selected');
});

$(function() {
  $('li').on('click', function() {
    var baseClass = $(this).attr('class').split(' ')[0];
    $(this).toggleClass(baseClass + '_selected');
  });
});

li.myClass {
  border: 1px dashed red;
  background-color: #ffcccc;
}
li.myClass_selected {
  border-style:solid;
}
li.myWrap {
  border: 1px dashed green;
  background-color: #ccffcc;
}
li.myWrap_selected {
  border-style:solid;
}
li.otherClass {
  font-style:italic;  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="myClass otherClass">Hello class</li>
  <li class="myWrap otherClass">Hello wrap</li>
</ul>

Answer 2

请尝试此功能：

<script type="text/javascript" language="javascript">

$(document).ready(function() {
  $('.myWrap').on('click', function() {
      var newclass = $(this).attr('class') + "_selected";
    $(this).toggleClass(newclass);
});
});

</script>

HTML根据当前类JS的名称附加一个类

2 个答案: