选择复选框列表然后单击 li 按钮以完成弹出窗口的 Javascript 函数

如何解决选择复选框列表然后单击 li 按钮以完成弹出窗口的 Javascript 函数

我需要递归 JavaScript 函数来选择一个复选框列表，然后点击一个按钮，最后点击另一个按钮来完成一个操作。

查看拍摄图片

检查类名是(checkBoxes)，li按钮是(liBtn)，模态完成按钮是(btn-success)

简要地我创建了这个函数

const char delim[] = "\t ><";

但返回此错误

function automation() {
    let chBox = document.querySelectorAll(".checkBoxes");
    for (var i = 0; i < chBox.length; i++) {
        let chBox = document.querySelectorAll('.checkBoxes');
        chBox.forEach (btn => btn.click());
        let btnElem = document.querySelector('li#Li3');
        btnElem.click();
       }
}

提前致谢

解决方法

我需要更多有关该问题的信息才能更有帮助。

我可能有误解，但我认为您不需要递归点击列表项。

这是因为 document.querySelectorAll('.checkboxes') 选择了该类的所有复选框，因此它会点击所有复选框（参见下面的第一个片段）。

按钮错误可能是由于 querySelector 没有找到目标，这意味着您可能在尝试选择该元素时使用了错误的 CSS 属性（请参阅下面的第二个片段）。

function automation() {
      let chBox = document.querySelectorAll('.checkboxes');
      chBox.forEach (btn => btn.click());
      let btnElem = document.querySelector('li#Li3');
      btnElem.click();
};

automation();


// demostrates click works
let btnElem = document.querySelector('li#Li3');
btnElem.addEventListener('click',() => alert('button clicked'));

<div class='container'>
  <input class='checkboxes' type='checkbox' />
  <input class='checkboxes' type='checkbox' />
  <input class='checkboxes' type='checkbox' />
</div>
<hr />
<div class='container'>
  <input class='checkboxes' type='checkbox' />
  <input class='checkboxes' type='checkbox' />
  <input class='checkboxes' type='checkbox' />
</div>
<hr />
<li id='Li3'>button</li>

   function clickNoElement() {
       let btnElem = document.querySelector('li#WrongId');
       btnElem.click();
    }

clickNoElement();

 <li type='button' id='ActuallyId'>Button</li>