网站 › 『编程语言讨论求助区』 › 模拟点击事件设置延时

探索1979 发表于 2023-11-10 18:11

模拟点击事件设置延时

想让模拟点击事件每次延时5秒钟，可是没有反应
function monitorDomChange() {
randomChars.forEach(function(value) {
   console.log(value);
    // 模拟点击事件
    if (value) {
       setTimeout(() => {
    // 在这里执行您想要的操作
       const event = new MouseEvent('click', {
             bubbles: true,
             cancelable: true,
             view: unsafeWindow,
         });
            value.dispatchEvent(event);
          }, 5000);
      //setInterval( value.dispatchEvent(event), 5000);
      
      //debugger
      const targetDivSelector = '#endText';
      const targetDiv = document.querySelector(targetDivSelector);
            if (targetDiv) {
                console.log('发现div:', targetDiv);
                // 在这里可以对目标div进行操作或获取需要的数据
            } else {
                console.log('没有发现div');
            }
            }
          }      
      );

    }

tanglikecuan 发表于 2023-11-10 18:11

探索1979 发表于 2023-11-12 18:44
大神目前是可以实现每隔5秒实现模拟点击一次，但奇怪的是最后一次循环打印console.log('发现div:',...

我检查了一下代码，问题可能出现在对targetDiv和value的读取上。由于使用了异步函数setTimeout，所以在打印targetDiv.innerHTML和value.innerHTML时，可能已经发生了元素的变化。因此，你需要确保在获取元素和打印元素时，它们仍然存在并且具有正确的值。

另外，在每次循环中都使用相同的延迟时间（5000毫秒），这可能会导致一些问题。如果希望每个元素都有不同的延迟时间，应该在每次循环时使用不同的延迟时间。

请参考以下修改后的代码：

javascript
const targetDivValues = [];
function monitorDomChange() {
    randomChars.forEach(function(value, index) {
      console.log(value); // 打印value
      setTimeout(function() {
            // 在这里执行您想要的操作
            const event = new MouseEvent('click', {
                bubbles: true,
                cancelable: true,
                view: unsafeWindow,
            });
            value.dispatchEvent(event); // 模拟点击事件

            // 获取目标div
            const targetDivSelector = '#endText';
            const targetDiv = document.querySelector(targetDivSelector);
            if (targetDiv) {
                console.log('发现div:', targetDiv); // 打印目标div
                targetDivValues.push(targetDiv.innerHTML);
                targetDivValues.push(value.innerHTML);
            } else {
                console.log('没有发现div');
            }
      }, index * 5000 + 5000 * index); // 根据index来设置不同的延时时间，防止重叠
    });
      // 将存储器数据保存为HTML文件
    const htmlContent =targetDivValues.map(value => value.replace(/&draft=0&type=norm&pm=y/g, '').replace(/&draft=0&type=norm&actID=0/g, '')).join('');
    const blob = new Blob(, { type: 'text/html' });
    const url = URL.createObjectURL(blob);
    const link = document.createElement('a');
    link.href = url;
    console.log('书名1111',title);
    link.download = `${title}.html`;
    link.click();
}
这个修改的代码在每次循环时都会为setTimeout函数提供一个不同的延迟时间，这样就可以防止它们重叠。同时，我建议你在获取targetDiv和value元素之前，先检查它们是否存在，以避免在元素已经发生变化之后再去获取它们的值。

浪尘 发表于 2023-11-10 18:37

你可以试试按键精灵或者百宝箱看看，还蛮好用的

知心 发表于 2023-11-10 18:41

js的setTimeout是异步的，你按这个方面搜索一下资料

探索1979 发表于 2023-11-10 19:16

知心 发表于 2023-11-10 18:41
js的setTimeout是异步的，你按这个方面搜索一下资料

大佬的意思放在forEach里面不行，对吗，有什么解决方法吗？

鹿鸣 发表于 2023-11-10 19:35

function monitorDomChange() {
    randomChars.forEach(function(value) {
      console.log(value);
      // 模拟点击事件
      if (value) {
            setTimeout(() => {
                // 在这里执行您想要的操作
                if (value.dispatchEvent) {
                  const event = new MouseEvent('click', {
                        bubbles: true,
                        cancelable: true,
                        view: unsafeWindow,
                  });
                  value.dispatchEvent(event);
                } else {
                  console.log('Value does not support dispatchEvent');
                }
            }, 5000);

            const targetDivSelector = '#endText';
            const targetDiv = document.querySelector(targetDivSelector);
            if (targetDiv) {
                console.log('发现div:', targetDiv);
                // 在这里可以对目标div进行操作或获取需要的数据
            } else {
                console.log('没有发现div');
            }
      }
    });
}

urdarling 发表于 2023-11-10 21:12

好像没有看到随机数部分？

tanglikecuan 发表于 2023-11-11 09:37

从你的代码来看，你在使用 setTimeout 来延迟点击事件，但可能存在一些问题。你的 setTimeout 函数在每一轮循环中都会执行，这意味着它们会以你循环的速度进行，而不是每隔5秒执行一次。

如果你想让模拟点击事件每隔5秒执行一次，你应该在 setTimeout 的回调函数内部进行循环。这样，每次回调执行完毕后，都会等待5秒后开始下一次循环。

另外，你的 monitorDomChange 函数中没有对 randomChars 进行初始化，你需要确保 randomChars 是一个包含需要点击的DOM元素引用的数组。

下面是一个可能的修改：

javascript
let randomChars = [/* 在这里填充需要点击的DOM元素引用 */];

function monitorDomChange() {
    randomChars.forEach(function(value, index) {
      console.log(value);
      // 模拟点击事件
      if (value) {
            setTimeout(() => {
                // 在这里执行您想要的操作
                const event = new MouseEvent('click', {
                  bubbles: true,
                  cancelable: true,
                  view: unsafeWindow,
                });
                value.dispatchEvent(event);
            }, 5000 * (index + 1)); // 这里根据索引来设置不同的延时时间，保证每个元素点击的间隔为5秒
            //debugger
            const targetDivSelector = '#endText';
            const targetDiv = document.querySelector(targetDivSelector);
            if (targetDiv) {
                console.log('发现div:', targetDiv);
                // 在这里可以对目标div进行操作或获取需要的数据
            } else {
                console.log('没有发现div');
            }
      }
    });
}

探索1979 发表于 2023-11-11 18:56

本帖最后由 探索1979 于 2023-11-11 19:40 编辑

tanglikecuan 发表于 2023-11-11 09:37
从你的代码来看，你在使用 setTimeout 来延迟点击事件，但可能存在一些问题。你的 setTimeout 函数在每一轮 ...
大佬你好，用你的代码测试一下，实现了每5秒点击一次，但是在打印console.log(value);和console.log('发现div:', targetDiv);之后模拟点击的，我的代码想实现先打印console.log(value);之后模拟点击其次再打印console.log('发现div:', targetDiv);，原因是我先循环获取value用于模拟点击，每次模拟点击后另一个id为endText会显示不同的文本，我把它打印出来console.log('发现div:', targetDiv);
下面是我要获取数组值
let randomChars = [
'<span id="treeDemo_1_span">前言</span>',
'<span id="treeDemo_2_span">第1章</span>',
'<span id="treeDemo_3_span">第2章</span>'
];
其中模拟点击子菜单后id为endText的值
<div class="content" id="endText" name="content">
<div id="tree19976634">
    <h4>1.不提倡使用的农药</h4></div>
<div>
    <p>杀虫剂：抗蚜威、毒死蜱、吡硫磷、三氟氯氰菊酯、氯氟氰菊酯、甲氰菊酯、氰氯苯醚菊酯、氰戊菊酯、异戊氰酸酯、敌百虫、戊酸氰醚酯、高效氯氰菊酯、贝塔氯氰菊酯、杀螟硫磷、敌敌畏等。</p>
    <p>杀菌剂：敌磺钠（地克松、敌克松）、冠菌清等。</p>
    <p>中等毒性、注意农药使用的安全间隔期。</p>
</div>
<div id="tree19976636">
    <h4>2.果树生产禁用的农药（高毒高残留）</h4></div>
<div>
    <p>六六六、滴滴涕（DDT）、毒杀芬、二溴氯丙烷、杀虫脒、二溴乙烷、除草醚、艾氏剂、狄氏剂、汞制剂、砷类、铅类、敌枯双、氟乙酸胺、甘氟、毒鼠强、氟乙酸钠、毒鼠硅、甲拌磷、乙拌磷、久效磷、对硫磷、甲基对硫磷、甲胺磷、甲基异柳磷、氧化乐果、磷胺、特丁硫磷、甲基硫环磷、治螟磷、内吸磷、灭线磷、硫环磷、蝇毒磷、地虫硫磷、氯唑磷、苯线磷。</p>
    <p class="fire_center"></p>
    <p style="text-align:center">
      <img id="img_19976638" style="text-align: center; max-width: 90%; margin-left: -2em;" src="https://www.123.com/booklib/zpimage.zhtml?ID=19976638&SiteID=123&draft=0&type=norm&pm=y" class="imagedata0" w="20" h="20"></p>
    <p>
    </p>
    <p class="fire_center"></p>
    <p style="text-align:center">
      <img id="img_19976639" style="text-align: center; max-width: 90%; margin-left: -2em;" src="https://www.123.com/booklib/zpimage.zhtml?ID=19976639&SiteID=123&draft=0&type=norm&pm=y" class="imagedata0" w="20" h="20"></p>
    <p>
    </p>
</div>
</div>

探索1979 发表于 2023-11-11 18:58

鹿鸣 发表于 2023-11-10 19:35
function monitorDomChange() {
    randomChars.forEach(function(value) {
...

你好，我测一下，大佬 ，没有实现每五秒模拟点击

查看完整版本: 模拟点击事件设置延时