Javascript 什么会导致click（）方法失败？

我有一个元素（复选框），带有以下HTML：

<button type="button" class="_f_V1 noMargin o365button" aria-labelledby="_ariaId_28" role="checkbox" aria-checked="false">
    <span class="_fc_3 owaimg checkboxImage wf-size-checkboxMultiselectSize ms-bg-color-white ms-border-color-neutralSecondaryAlt"> </span>
    <span class="_fc_4 o365buttonLabel _fc_2" id="_ariaId_28" style="display: none;"></span>
</button>

但是什么也没发生——复选框不会被选中

鉴于此（第一个）元素只是类似元素列表中的一个，我也尝试了：

(()=>{
    document.querySelectorAll('button span').forEach((e)=>{
        e.click()
    });
})();

同样，未选中第一个复选框或任何其他复选框

通过在console中运行

querySelector（）

和

queryselectoral（）

（及其相关选择器），我得到了我想要的元素（我没有得到

未定义的

），因此这意味着我的选择是正确的

如果选择正确，为什么

click（）

方法没有效果

当我用鼠标单击时，复选框是选中的，但当我在同一元素上使用

click（）

时，复选框不是选中的

如果您想尝试在线复制，您需要有一个Hotmail电子邮件帐户，其中包含您已删除的邮件。如果是这种情况：

---

转到“已删除项目”

转到“恢复已删除的项目”

将打开一个包含已删除对话的窗口

在每个对话旁边都会有一个复选框（鼠标悬停后）。这是我遇到麻烦的元素

注意：鼠标悬停只会更改复选框的不透明度。

您可以尝试使用它，它只适用于创建的jQuery集合，如：

jQuery( 'your whatever selector(s) here' ) // form here on you can call .click() now

因此，对于您的具体方法，您可以：

jQuery('._f_V1.noMargin.o365button').click();

以及：

jQuery('button span').click();

jQuery('button span').each(function() {
    $(this).click();
});

---

由于jQuery

click

方法只会在jQuery集合的第一个DOM元素上触发单击事件，因此您可以将其与以下内容组合：

jQuery('._f_V1.noMargin.o365button').each(function() {
    $(this).click();
});

以及：

jQuery('button span').click();

jQuery('button span').each(function() {
    $(this).click();
});

函数handleclick（）{
if（this.getAttribute（“aria已选中”）=“true”）{
这个.setAttribute（“aria checked”、“false”）；
}否则{
这个.setAttribute（“aria checked”、“true”）；
}
}
var button=document.getElementsByTagName（'button'）；
对于（变量i=0；i

如果问题是：

什么会导致click（）方法失败

那么答案是：没什么如果对HtmleElement可用，则调用

HtmleElement.click（）

不能“失败”（从这个意义上讲）。可能发生的情况是，在该元素上调用click将不会产生预期的效果/影响-这是问题作者的情况！“为了完整起见……”

---

经过深入调查，我的结论如下

负责检查和取消选中（以及所有与之相关的）的实际事件处理程序是回调“侦听”

mousedown

-这些

按钮上的事件；因此，触发
单击
-事件时，您将一无所获。有人可能会问：“你怎么能这么说？”。我之所以这么说，是因为我删除了所有其他事件侦听器，首先遍历两个父元素，然后再遍历每个子元素，除了我留下的
mousedown
-eventListener的
按钮。功能仍然完好无损。在删除最后一个事件侦听器之后，功能就消失了。所以我想：是的，我可以这么说：）

我的下一步是在

按钮上触发一个
mousedown
-事件，如下所示：

$('._f_V1.noMargin.o365button').each(function() {
    $(this).mousedown();
})

var $El = $('._f_V1.noMargin.o365button').parent().parent();
$El.add( $El.find('*') ).each(function() {
    $(this).mousedown().mouseup().click();
    // may be one event is cancelling the result of another one out
    // so I also tried $(this).mousedown()
});

但这不行

那么，在每一个可能相关的元素上，歇斯底里地触发事件，比如：

$('._f_V1.noMargin.o365button').each(function() {
    $(this).mousedown();
})

var $El = $('._f_V1.noMargin.o365button').parent().parent();
$El.add( $El.find('*') ).each(function() {
    $(this).mousedown().mouseup().click();
    // may be one event is cancelling the result of another one out
    // so I also tried $(this).mousedown()
});

不，这也不行

所以我想出了我的最后一个方法，但也不管用。让我们模拟所选

按钮

中的属性和属性。顺便说一句，实际上负责使“伪复选框”看起来像选中/未选中的元素是

按钮
-元素的第一个
子节点。因此，如果您在浏览器devtool的控制台中键入以下代码，则所有内容都将与正确单击的内容完全相同（也就是说，鼠标指向自己）：

请参见下面的屏幕截图，我将上面的代码片段直接粘贴到devtools控制台中，并在单击时显示“伪复选框”

那么现在该怎么办呢？再问一个问题！更具体的一个。类似于：“如何[recover | deepDelete]hotmail.com中所有已删除的邮件”，因为这正是问题的真正目的——我不确定，但我猜

---

我想再次强调这一点：一般来说，OP中的代码和这个答案中的代码都是有效的。可以说，这是正确的。但它无法实现作者想要实现的目标

---

此外，以下是OPs代码实际运行的证明：

document.querySelector（'.\f_V1.noMargin.o365按钮'）。addEventListener(
'click'，function（）{console.log（'jepp'）}
);
document.querySelector（'.\u f_V1.noMargin.o365按钮'）。单击（）；
//顺便说一句：yep HtmleElement.click（）返回未定义的
console.log(
'yep HtmleElement.click（）返回：'，
document.querySelector（'.\u f_V1.noMargin.o365按钮'）。单击（）
)

按钮{宽度：100%；高度：100%；位置：固定}

你能提供代码片段让我检查一下吗？用

e.setAttribute（“aria checked”，“true”）

代替

e.click（）

你确定你在屏幕上看到的元素真的与你附加的click事件相同吗？Dhaval，没有显示整个代码。似乎需要更多的HTML，但由于没有任何有效的方法来复制DOM代码（至少，我不知道），遗憾的是，我可能不会提供这样的东西，即使是我想要的…@dann，我已经用

setAttribute（）

尝试了一些操作，包括您给出的确切示例，但没有帮助。Axel，我可以发誓，我有几个案例至少

document.querySelector（'something'）。click（）工作。总之，
jQuery（'b