当我退出元素,并返回之后,行为不一样。可能是event.target

时间:2017-08-03 16:46:57

标签: javascript html object dom

我用导航器检查了我的脚本,我找到了问题,但我无法解决这个问题。

当我点击我的元素时,他打开一个列表,如果在此下拉列表外单击(在document.body上)并再次点击此下拉列表我无法在列表中选择新值。我想这可能是我的目标。

let open = document.querySelectorAll('.sub-container div');
for (let loop = 0; loop < open.length; loop++) {
  open[loop].addEventListener('click', () => {
    let tabLi = {};
    let list = open[loop].querySelectorAll('.tryit li')
    let cross = open[loop].querySelector('h3 .clear-filters');

    for (let l = 0; l < list.length; l++) {
      list[l].addEventListener('click', (e) => {
        e.stopPropagation();
        if (!list[l].classList.contains('active-dropdown')) {
          list[l].classList.add('active-dropdown');
          tabLi[l] = list[l];
          console.log(tabLi)
          cross.style.display = 'block';
        } else {
          list[l].classList.remove('active-dropdown');
          delete tabLi[l];
          if (Object.keys(tabLi).length === 0) {
            cross.style.display = 'none';
          }
        }
      });
      cross.addEventListener('click', (e) => {
        e.stopPropagation()
        list[l].classList.remove('active-dropdown');
        delete tabLi[l];
        cross.style.display = 'none';
      })
    }
  })
}

0 个答案:

没有答案