单击(）的另一种方式

Alternative way for click()

本文关键字：另一种 方式 单击      更新时间：2023-09-26

我一直在通过page.evaluate()上的phantomJS引擎使用click()，它运行得很好。但有时它就是不起作用，我不知道为什么。

例如，我试图点击按钮验证这里的

我试过这个：

page.evaluate(function() {
  document.getElementById('recaptcha-verify-button').click();
});

这个：

rect = page.evaluate(function() {
  return document.getElementById('recaptcha-verify-button').getBoundingClientRect();
});
console.log(rect.left + " " + rect.right);
page.sendEvent('mousemove', rect.left + rect.width / 2, rect.top + rect.height / 2);
page.sendEvent('mousedown', rect.left + rect.width / 2, rect.top + rect.height / 2);
page.sendEvent('mouseup', rect.left + rect.width / 2, rect.top + rect.height / 2)

两者都不起作用，click()之后没有输出，但我在chrome上尝试了同样的方法，结果是一样的。欢迎提出任何想法或建议。

您可以使用任何以前已知的方式进行单击。您有两个与点击本身无关的问题：

  • 元素只能在其各自的文档中访问。ReCAPTCHA总是加载在iframe中，这是一个您必须切换到的不同文档。例如：page.switchToFrame(0);

  • 谷歌根据用户代理的功能提供不同的页面（本例中为PhantomJS）。它检测到PhantomJS没有启用JavaScript（出于某种原因），并提供了一个没有#recaptcha-verify-button元素的不同表单。相反，它有：

    <div class="fbc-button-verify">
    <input type="submit" value="Verify">
</div>

完整脚本：

var page = require('webpage').create();
page.open('https://www.google.com/recaptcha/api2/demo', function() {
    page.render('1.png');
    page.switchToFrame(0);
    page.evaluate(function(){
        document.querySelector('.fbc-button-verify > input').click();
    });
    setTimeout(function(){
        page.render('2.png');
        phantom.exit();
    }, 3000);
});

使用PhantomJS 1.9.8和2.1.1 进行测试

以下是模拟点击元素的函数

function simulateClick(element) {
    var event = document.createEvent("MouseEvents");
    event.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    element.dispatchEvent(event);
}

我认为这就是您需要解决的问题

我不确定我是否理解你的问题，但有时你会遇到id的意外问题，因为id必须再次使用uniq和一些引擎make元素，这可能会导致问题的发生。

请更多描述如果我在理解问题时有错误

我认为您必须使用class而不是id，并且您可以简单地使用out-jquery来实现这一点
看看这个例子：

var tests = document.querySelectorAll('.test');
for(var i=0; i<tests.length; i++){
  tests.item(i).click();
}
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <div class="test" onclick="alert(1);">test 1</div>
  <div class="test" onclick="alert(2);">test 2</div>
</body>
</html>

相关文章：