WordPress(Elementor)站点页面加载时自动点击及弹窗触发求助

问题分析 #

你之前用document.getElementById("button").click()无效，主要原因有两个：

1. 按钮的ID并非button——Elementor生成的元素ID通常带专属前缀，比如elementor-button-xxx；
2. 弹窗脚本（suv4.js）做了人工交互检测，只响应真实的用户操作（如鼠标点击、触摸），直接调用click()属于模拟事件，会被拦截。

解决步骤 #

第一步：修正按钮自动点击脚本 #

先找到按钮的正确选择器：

• 打开浏览器开发者工具（F12），选中蓝色按钮，查看它的ID或类名（比如类名elementor-button，或IDelementor-button-xxx）；
• 用更可靠的选择器编写脚本，比如按文本匹配（若按钮文本唯一）：

document.querySelector('button:contains("Full 2022-2023 Schedule")').click();

或按类名匹配：

document.querySelector('.elementor-button').click();

注意：要确保脚本在按钮加载完成后执行，可选择window.onload或Elementor自定义JS里的「DOM Content Loaded」触发时机。

第二步：模拟真实用户点击触发弹窗 #

如果弹窗脚本拦截模拟点击，可通过以下两种方式绕过检测：

方法1：模拟完整鼠标点击事件

创建符合浏览器标准的MouseEvent，分发到页面主体上，模拟真实用户点击：

window.addEventListener('load', function() {
  // 先点击目标按钮（替换为实际选择器）
  const scheduleBtn = document.querySelector('.elementor-button');
  if (scheduleBtn) scheduleBtn.click();

  // 模拟真实鼠标点击页面任意位置
  const clickEvent = new MouseEvent('click', {
    bubbles: true,
    cancelable: true,
    view: window
  });
  document.body.dispatchEvent(clickEvent);
});

方法2：直接触发弹窗核心逻辑

若suv4.js的弹窗绑定了特定触发函数，可通过开发者工具分析后直接调用：

1. 打开F12的Sources面板，找到suv4.js；
2. 搜索click、popup、trigger等关键词，定位触发弹窗的函数；
3. 直接调用该函数（若函数未被闭包隐藏）。

第三步：Elementor中添加脚本的正确方式 #

1. 进入Elementor编辑器，点击页面左下角的「设置」图标；
2. 切换到「高级」选项卡，找到「自定义JS」；
3. 粘贴上述脚本，选择「DOM Content Loaded」或「Window Loaded」触发时机；
4. 更新页面并清除缓存后测试效果。

额外提示 #

• 部分弹窗脚本会检测操作频率，可添加延迟确保脚本加载完成：

window.addEventListener('load', function() {
  setTimeout(() => {
    // 执行点击操作
  }, 1000); // 延迟1秒
});

内容的提问来源于stack exchange，提问作者AuntJemiroquai