我正在使用带有 headless=false
选项的 puppeteer,以便让用户在表单中键入一些详细信息,然后以编程方式读取结果。
我希望光标/焦点在页面加载时位于第一个输入字段上,但焦点始终位于地址栏上。
有没有办法在页面内移动光标/焦点?
我已经尝试过 await page.focus(selector)
。
请找到以下示例:
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch({ headless: false});
const page = await browser.newPage();
let selector = ".w3-white.w3-padding.notranslate>form>input[name='firstname']";
await page.goto('https://www.w3schools.com/html/html_forms.asp');
await page.waitForSelector(selector,{waitUntil :"networkidle2"});
await page.focus(selector);
await page.type(selector,"aaa");
//await browser.close();
})();
我希望在页面加载后,用户将能够在输入字段中键入内容,而不必先“移动”到该字段中(通过鼠标或 Tab)。
最佳答案
您遇到的问题是您将光标设置在页面内,但浏览器本身的焦点仍在地址栏上。
为了让浏览器聚焦页面本身,你需要调用page.bringToFront()
这会将浏览器的焦点设置到选项卡。您应该在创建页面后立即这样做:
const page = await browser.newPage();
await page.bringToFront();
此外,正如其他答案中已经指出的那样,您为 page.waitForSelector
提供了无效的选项。功能。这只是被 puppeteer 忽略了(与您的问题无关),但应该被删除。
关于node.js - headless false - 始终关注地址栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55825243/