从动态复选框的父级中提取类名

Extracting class name from parent of dynamic checkbox

本文关键字：提取 动态 复选框      更新时间：2023-10-19

我正在尝试从类名中提取数字并将其添加到数组中，但收到错误消息"对象不支持属性或方法'parent'"。我刚才只是在提取类名的部分。

谢谢

<ul id="catbox">
    <li class="cat-item cat-item-2">
        <a href="http://oursite/events/category/internal-events/">Internal Events</a>
        <ul class='children'>
            <li class="cat-item cat-item-8">
                <a href="http://oursite/events/category/internal-events/civic-and-ceremonial/">Civic and Ceremonial</a>
            </li>
            <li class="cat-item cat-item-6">
                <a href="http://oursite/events/category/internal-events/economy-and-skills-education-tourism-town-centre-business-events/">Economy and Skills – Education, Tourism, Town Centre, Business Events</a>
            </li>
            <li class="cat-item cat-item-7">
                <a href="http://oursite/events/category/internal-events/health-and-social-care/">Health and Social Care</a>
            </li>
            <li class="cat-item cat-item-13">
                <a href="http://oursite/events/category/internal-events/other-internal-events/">Other</a>
            </li>
            <li class="cat-item cat-item-5">
                <a href="http://oursite/events/category/internal-events/safer-communities-vibrant-communities-leisure-trust/">Safer Communities – Vibrant Communities, Leisure Trust</a>
            </li>
        </ul>
    </li>
</ul>
<script type="text/javascript">
    $("#test").load("/events/cal-page/");
    $(".cat-item").prepend("<input type='"checkbox'" >  ");
    $(":checkbox").change(function () {
        if (this.checked) {
            var values = $('input:checkbox:checked').map(function () {
                return this.parent().attr('class');
            }).get();
            alert(values);
            $("#test").load("/events/cal-page/?q=" + number + "");
        }
    });
</script>

.parent()是一种jQuery包装元素的方法。 callback 中的this将表示DOM元素，而不是jQuery包装的元素。

使用return $(this).parent().attr('class'); 

$(".cat-item").prepend("<input type='"checkbox'" >");
$(":checkbox").change(function() {
  if (this.checked) {
    var values = $('input:checkbox:checked').map(function() {
      return $(this).parent().attr('class');
    }).get();
    alert(values);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul id="catbox">
  <li class="cat-item cat-item-2"><a href="http://oursite/events/category/internal-events/">Internal Events</a>
    <ul class='children'>
      <li class="cat-item cat-item-8"><a href="http://oursite/events/category/internal-events/civic-and-ceremonial/">Civic and Ceremonial</a>
      </li>
      <li class="cat-item cat-item-6"><a href="http://oursite/events/category/internal-events/economy-and-skills-education-tourism-town-centre-business-events/">Economy and Skills – Education, Tourism, Town Centre, Business Events</a>
      </li>
      <li class="cat-item cat-item-7"><a href="http://oursite/events/category/internal-events/health-and-social-care/">Health and Social Care</a>
      </li>
      <li class="cat-item cat-item-13"><a href="http://oursite/events/category/internal-events/other-internal-events/">Other</a>
      </li>
      <li class="cat-item cat-item-5"><a href="http://oursite/events/category/internal-events/safer-communities-vibrant-communities-leisure-trust/">Safer Communities – Vibrant Communities, Leisure Trust</a>
      </li>
    </ul>
  </li>
</ul>

在map()中使用 jQuery 对象$(this)而不是this，如下所示。

$(this).parent().attr('class');

你的问题是你没有使用jQuery元素来调用来自jQuery的parent((方法。

更改此行，此行为 $(this(。

return $(this).parent().attr('class');
相关文章：