循环复选框并删除隐藏副本javascript

时间:2017-04-21 01:07:24

标签: javascript jquery

好的,我试图在该循环中创建循环和循环。关键是要创建一个删除功能。我有一个用户列表和隐藏的那些用户的副本。复制的目的是在点击“在线”时显示它们。链接或“离线”#39;链接或全部'。当我想删除一个用户时,我为每个用户创建了一个复选框,通过单击该复选框,它会将该元素推送到一个数组中。然后当我点击减去它删除该用户并循环通过隐藏副本并删除匹配id的那些。它适用于一个用户,或者如果我从列表底部检查/选择用户,那么它通过数组完全正常循环并从DOM中删除所有副本。但是,如果我按照正常的方式选择列表中的第一个用户然后选择第二个然后第三个等,那么它将仅通过第一个用户元素循环。但是在控制台中,它表明该阵列具有我推入的用户,它实际上将循环通过第一个元素的次数作为我推入它的用户数量。 有人指出不使用重复的ID,我知道,但我不知道如何完成这个,我尝试使用标题,名称,但不能使用类因为我有多个类的元素。我很清楚,如果我向后选择元素,它为什么会起作用。这是我的项目中的一个孤立的例子,所以它只有一个类,我没有隐藏的副本。这只是帮助人们更好地了解我的尝试。可见副本需要通过只检查一个副本而消失,但它有相同的错误,html没有看到显示父div ..

http://codepen.io/Pagnito/pen/vmLOvj?editors=1010



function minus() {
  $('.fa-minus').click(function() {

    if ($('.chBox').is(':checked')) {

      var div = $(':checked').closest('div');
      var dib = div.next();
      $(checkedArr).each(function(i, iteM) {
        console.log(checkedArr)
        var ch = iteM;
        var chkd = $(ch).attr('id')
        console.log(chkd)
        console.log('hi' + i)
        $('.g').each(function(index, item) {
          var ite = $(item).attr('id')

          if (ite == chkd) {

            $(item).remove();
            var dib = div.next('#acc');
            $(dib).remove();
          }
        })
      })
      var dib = div.next('#acc');
      $(dib).remove();
      $(':checked').closest('a').remove();
      checkedArr = [];
    }
  })
}

<div class="list-group hidden-xs-down streams">
  <div class="g" class="free"><input class="chBox" type="checkbox" name="user">Free</div>
  <div class="g" id="ninja"><input class="chBox" type="checkbox" name="user">ninja</div>
  <div class="g" id="big"><input class="chBox" type="checkbox" name="user">big</div>
  <div class="g" id="free"><input class="chBox" type="checkbox" name="user">Free</div>
  <div class="g" id="ninja"><input class="chBox" type="checkbox" name="user">ninja</div>
  <div class="g" id="big"><input class="chBox" type="checkbox" name="user">big</div>
  <div class="g" id="free"><input class="chBox" type="checkbox" name="user">Free</div>
  <div class="g" id="ninja"><input class="chBox" type="checkbox" name="user">ninja</div>
  <div class="g" id="big"><input class="chBox" type="checkbox" name="user">big</div>
</div>
&#13;
&#13;
&#13;

0 个答案:

没有答案