Question

我尝试使用jquery获取复选框ID，但失败。我不知道为什么，但是谢谢您让我知道问题是什么

我想知道是什么原因引起的

django模板（todo_list.html）

        {% for p in object_list %}
        <tr>
            <td>
                <input type="checkbox" id="{{p.pk}}" class="td_check">
            </td>
            <td>{{p.classification}}</td>
            <td>
                <a href="" id={{p.id}} class="title_for_list">
                    {{p.title}}
                </a>
            </td>
            <td>{{p.now_diff}}</td>
            <!-- <td>{{p.author}}</td> -->
            <td>
            </td>
        </tr>
        {% endfor %}
    {% else %}
        <tr>
            <td colspan="5">
                <h4>no article</h4>
            </td>
        </tr>

jquery

$('#todo_delete_button').click(function(e){
    e.preventDefault();
    // todo_check
    var todo_arr = [];
    alert("delete button is clicked")
    // Get checked checkboxes
    $('.td_check input[type=checkbox]').each(function() {
      if (jQuery(this).is(":checked")) {
        var id = this.id;
        alert("id : " +id)
        todo_arr.push(id);
        alert('todo_arr : ', todo_arr)
      }
    });
})

Answer 1

问题是因为您的选择器错误；复选框本身具有.td_check类，但您的选择器正在寻找该类的子项。修复选择器，您的代码将起作用：

$('.td_check').each(function() { 
  // ...
});

话虽如此，您可以通过使用:checked选择器删除if条件并使用map()来构建数组来简化代码。试试这个：

$('#todo_delete_button').click(function(e) {
  e.preventDefault();

  var todo_arr = $('.td_check:checked').map(function() {
    return this.id
  }).get();
  console.log(todo_arr);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr><td><input type="checkbox" id="a" class="td_check" checked="true"></td></tr>
  <tr><td><input type="checkbox" id="b" class="td_check"></td></tr>
  <tr><td><input type="checkbox" id="c" class="td_check" checked="true"></td></tr>
  <tr><td><input type="checkbox" id="d" class="td_check"></td></tr>
  <tr><td><input type="checkbox" id="e" class="td_check" checked="true"></td></tr>
</table>
<button id="todo_delete_button">Click me</button>

我试图使用jquery获取复选框ID，但失败了。我想知道是什么问题

1 个答案: