.click() 函数未触发答案

【问题标题】：.click() Function doesn't Triggered.click() 函数未触发
【发布时间】：2021-07-02 21:00:02
【问题描述】：

Body onload 会触发一个名为“autoClicker”的函数来单击选定的“span”元素。它会提醒哪个函数正在正常调用。我控制台记录了我检查的元素，我选择了正确的。在最后一步它似乎不会被点击，因为如果点击发生，以下选项将可用。

亲爱的，我不知道为什么它没有点击，我期待您的宝贵贡献。

我添加到 theme.js 文件中的函数

$(function autoClicker(){
  console.log("it works!");
  var x = document.getElementsByClassName("variant-text")[0];
  x.click();
});

我想选择第一个“variant-text”分类元素，你可以在here找到

这是sneakershop网站，我想自动选择颜色，因为每个产品中已经有一个颜色选项，并且加载了XML服务，我们无法更改它在特定时期刷新。

任何帮助感谢它。

【问题讨论】：

标签： javascript jquery class click

【解决方案1】：

我想问题是你先加载theme.js

<script type="text/javascript" src="//st2.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/theme.js?revision=7.1.3.2-5-1625248516"></script>
<script type="text/javascript" src="//st2.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/navigation-menu.js?revision=7.1.3.2-5-1625248516"></script>
<script type="text/javascript" src="//st3.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/lazyload.min.js?revision=7.1.3.2-5-1625248516"></script>
<script type="text/javascript" src="//st3.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/jquery.elevatezoom.js?revision=7.1.3.2-5-1625248516"></script>
<script type="text/javascript" src="//st1.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/product.js?revision=7.1.3.2-5-1625248516"></script>
<script type="text/javascript" src="//st2.myideasoft.com/idea/hs/56/themes/selftpl_602d7702ef274/assets/javascript/rateyo.js?revision=7.1.3.2-5-1625248516"></script>

当您模拟点击时，很可能尚未附加 click 处理程序。

我要验证这一点的第一件事是：

$(function autoClicker(){
  console.log("it works!");
  var x = document.getElementsByClassName("variant-text")[0];
  setTimeout(() => x.click(), 3000);
});

假设可行，我会找到添加点击处理程序的文件，并确保您在之后运行它，或者只是创建一个您最后加载的新 js 文件。

【讨论】：

【解决方案2】：

我认为@dave 是正确的。您试图在元素生成之前单击它。 setTimeout 可能会起作用，尽管我从不喜欢使用它，因为您试图预测给定元素出现需要多长时间，这在每个用例中都不起作用。

有很多方法可以做到这一点，但 MutationObserver 和 'DOMNodeInserted' 有效。请注意，DOMNodeInserted 已被弃用，因此 MutationObserver 是可行的方法，尽管它可能在旧版浏览器中不可用。

以下使用 DOMNodeInserted 对我有用：

    function init(){
            var containerParent = null, container = null, targetNode = null;

            function Init () {
                container = document.getElementById ("main");
                targetNode = document.getElementsByClassName("variant-text")[0];

                if (targetNode.addEventListener) {
                    targetNode.addEventListener ('DOMNodeInserted', OnNodeInserted);
                }
            }

            function OnNodeInserted(){
                document.getElementsByClassName("variant-text")[0].click()
            }
    };
    init();

将尝试跟进使用 MutationObserver 的示例

【讨论】：