Question

我有一个跨越django模板中的循环。

root@minion:~# nc -v -z xx.xx.xx.xx 4505
salt [xx.xx.xx.xx] 4505 (?) open
root@minion:~# nc -v -z xx.xx.xx.xx 4506
salt [xx.xx.xx.xx] 4506 (?) open

我想在展开和折叠时上下切换图标，但也要确保它不会影响其他跨度，因为循环会为图书名称带来多个跨度。

我试过了

{% for book in books%}
<span class="book-list" data-toggle="collapse" data-target="#sheets_list{{workbook.id }}">
    {{book.name}}
    <span class="toggle_sign glyphicon glyphicon-chevron-down"></span> 
    <span class="date"> Last Update Time= {{book.reg_date}}</span>
</span>
{% endfor %}

但它在切换标志的课程上没有做任何事情。有什么帮助吗？

Answer 1

在这里看到他的工作代码。

并且您还将错误的类名传递给事件。

＆＃13;

  $(document).ready(function(e) {
    $('.parentDiv').click(function() {

      var toggle_sign = $(this).find(".toggle_sign");
      if ($(toggle_sign).hasClass("glyphicon-chevron-down")) {
        $(toggle_sign).removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up");
      } else {
        $(toggle_sign).addClass("glyphicon-chevron-down").removeClass("glyphicon-chevron-up");
      }
      // or toggle event you can use.
      //$(toggle_sign).toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
    });
  });

＆＃13;

.parentDiv {
  width: 100%;
  background: cyan;
  height: 50px;
  border:1px solid;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parentDiv">
  <span class="toggle_sign glyphicon glyphicon-chevron-down"></span>
</div>
<div class="parentDiv">
  <span class="toggle_sign glyphicon glyphicon-chevron-down"></span>
</div>

＆＃13;

希望这对你有很大的帮助

如何在django模板中切换span的切换glyphicon图标

1 个答案: