Django jquery获取按钮的内容

我正在制作一个日历，其中一些日期是满的，而另一些是开放的。 所有日期都用按钮显示，但“打开日期”按钮会在该日期打开一个窗体以创建新事件，而“完整日期”按钮则不会执行任何操作。为了打开表单，我使用了一个模式（该模式的代码是从bootstrap粘贴的非常好的mach副本）

我在模板中使用for循环来创建所有按钮。每当单击打开日期按钮时，我都需要将forloop.counter传递给我的函数。因为按钮是用forloop.counter编号的，所以我只能提取单击按钮的内容。 我已经用jquery传递了其他变量，如下所示：

            var test = '{{empty}}'

           {% for days, active in zip %}
    {% if active %}
    <button id="count" type="button" class="daybutton daybutton1" data-toggle="modal" data-target="#myModal{{forloop.counter}}">{{forloop.counter}}</button><!-- Modal -->
      <div class="modal fade" id="myModal{{forloop.counter}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel{{forloop.counter}}">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title" id="myModalLabel">Wählen Sie eine Uhrzeit für Ihren Termin am</h4><h5>{{ forloop.counter }}</h5><h6> {{month}} {{year}}</h6>
            </div>
            <div class="modal-body">
              {{forloop.counter}}
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Schließen</button>
              <button id="submit_btn" class="btn btn-link">Send the invitation</button>
              </div>
          </div>
        </div>
      </div>

    {% else %}
      <button id="inactive" class="daybutton inactive" > {{ forloop.counter}} </button>
    {% endif %}
  {% endfor %}

但是我没有通过forloop.计数器

我的html如下所示：

            var test = '{{empty}}'

           {% for days, active in zip %}
    {% if active %}
    <button id="count" type="button" class="daybutton daybutton1" data-toggle="modal" data-target="#myModal{{forloop.counter}}">{{forloop.counter}}</button><!-- Modal -->
      <div class="modal fade" id="myModal{{forloop.counter}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel{{forloop.counter}}">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title" id="myModalLabel">Wählen Sie eine Uhrzeit für Ihren Termin am</h4><h5>{{ forloop.counter }}</h5><h6> {{month}} {{year}}</h6>
            </div>
            <div class="modal-body">
              {{forloop.counter}}
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Schließen</button>
              <button id="submit_btn" class="btn btn-link">Send the invitation</button>
              </div>
          </div>
        </div>
      </div>

    {% else %}
      <button id="inactive" class="daybutton inactive" > {{ forloop.counter}} </button>
    {% endif %}
  {% endfor %}

这将显示警报，但消息始终为“1”

我在谷歌上搜索了一下，尝试了不同的方法，但它总是1，未定义或forloop的最后一个数字（在我的例子中是29）

---

我很高兴能为您提供一切帮助！=）

这并不像你想的那么奇怪：

---

您已经在for循环中创建了一个ID

 {% for days, active in zip %}
    {% if active %}
        <button id="count" type="button" class="daybutton daybutton1" data-toggle="modal" data-target="#myModal{{forloop.counter}}">{{forloop.counter}}</button>

'''

发送邀请

js将成为：

$（文档）。在“单击”上。提交功能（事件）{
count=$（this）.clone（'.clone'）.clone（）.html（）；
//count=$（this）.data（'id'）；如果您只需要id；
警报（计数）
});

这是合乎逻辑的：HTML在服务器上呈现。因此，当呈现

时，

forloop.counter

只是该特定时刻计数器的值，通常是循环的最后一个值。是的，当我收到29时也发生了这种情况，因此我在模式标题中显示计数器，id=count

{forloop.counter}

我应该能够从html中提取呈现的数字，但由于某些原因，它总是1:/您已经在for循环中创建了一个ID，

这意味着将使用该ID创建多个按钮。显然，

js

在执行

count=$（“#count”）.clone（）.html（）时将始终返回第一个ID

Oh，伙计，我想是因为我为每个按钮创建了一个不同的模式，它可能会有所不同——当我为我的按钮（我以前尝试过）使用

id=“submit_btn{{{{forloop.counter}}”和`id=“count{{forloop.counter}}`非常感谢！=）好的，我已经发布了一个答案，它是有效的，但不是最好的方式，我想知道你将如何在js中触发它，检查我的答案，我正在编辑的方式做它是的，我刚刚发现，因为你的评论！我之前在模态标题中有一个计数器，我认为它可能会有所不同，或者可以查看打开的模态。然后，当我将id粘贴到按钮时，忘记添加{{forloop.counter}}。谢谢！如果你必须处理js，你需要将
id
更改为
class
，正如我在回答中所显示的一样，一件小事是：警报会多次弹出-使用
发送邀请
可以防止这种情况，而且仍然可以正常工作。顺便说一句，谢谢，这看起来好多了！
<button type="button" data-id="{{forloop.counter}}" class="daybutton daybutton1 count"....>{{forloop.counter}}</button>

 <button data-id="{{forloop.counter}}" class="btn btn-link submit_btn">Send the invitation</button>
          </div>

$(document).on("click", ".submit_btn", function(event){
        count = $(this).closest('.clone').clone().html();
       // count = $(this).data('id'); if you just want the id;
        alert(count)
  });