Question

我正在尝试使用引导程序通过Django模板标签折叠一些在for循环中呈现的内容。如果我对折叠目标进行硬编码，无论是作为Class目标（data-target =“。someclass”）还是href（href =＃sometarget），我都可以使用该函数。但是，由于它是for循环，因此每个“项目”都需要不同的目标，因此当我尝试使用数据库中的动态/唯一数据作为目标时，引导程序无法折叠内容。

可折叠的触发器

{% for set in set_list %}
  {% get_comment_count for set as comment_count %}

  <!-- Title -->
    <a href="{% url 'curate:set_detail' slug=set.slug %}">
      <h1 class='title'>{{set.title}}
      </a>
      **<button class="btn btn-link btn-sm" data-toggle="collapse" role='button' href='#{{set.slug}}' data-target="" aria-expanded="false" aria-controls="multiCollapseExample1">**
        <i class="material-icons">
          arrow_drop_down
        </i>
      </button>

可折叠

  {% for item in set.items.all %}
      <div class="col-lg-2 col-sm-2 col-xs-6 item mr-1  set-item-small"  id="multiCollapseExample1" aria-expanded="true">

        {% if item.type == 'video' %}
        <a href="{% url 'curate:item_detail' slug=item.slug %}"><img class='img-fluid img-preview' src="{{item.image_sized.url}}" alt="broken"> </img>
          <span class="badge badge-success badge-positioner collapse multi-collapse show">Video</span>

SOME OTHER CODE

  **<div class="collapse {{set.slug}} multi-collapse" id={{set.slug}}>**
            <a href="{% url 'curate:item_detail' slug=item.slug %}">
              <h5 class='header collapse multi-collapse'>{{item.title}}</h5>
              <a href="{% url 'curate:set_detail' slug=set.slug %}#comment_thread">{{ comment_count }} comments</a>
            </a>
          </div>

在上面的示例中，我试图使用href目标，但这些目标均无效。我可以确认，当在Google中呈现时，该提示是正确的。我已经使用set.slug和set.pk进行了尝试，即使触发器href是＃259并且目标ID是＃259，它们都不起作用。参见下面的类似示例，但使用子弹。

**在Chrome浏览器中呈现的可折叠

<div class="collapse 259 multi-collapse" id="54330-this-set-is-going-to-be-about"><a href="/items/05310-criminal-genius/">
            </a><a href="/items/05310-criminal-genius/">
              <h5 class="header collapse multi-collapse">Criminal Genius</h5>
              </a><a href="/sets/54330-this-set-is-going-to-be-about/#comment_thread">0 comments</a>

          </div>

**在Chrome中折叠目标

<button class="btn btn-link btn-sm" data-toggle="collapse" role="button" href="#54330-this-set-is-going-to-be-about" data-target="" aria-expanded="false" aria-controls="multiCollapseExample1">
        <i class="material-icons">
          arrow_drop_down
        </i>
      </button>

如果我在Chrome开发人员工具中更改了ID，折叠功能就会开始起作用？

我的jquery加载到上述模板扩展的base.html的末尾。

使用Django模板标签中的数据设置目标ID甚至目标类时，崩溃.data-target无效

0 个答案: