Puppeteer 调用 onChange 事件处理程序不工作

Question

把我的头撞在墙上，希望有人能给我一些建议。

我正在尝试在加载到 Puppeteer 的页面中调用 onChange 处理程序。 While I am able to select the appropriate option within the select (verified by turning off headless) I am unable to get the event handler to 运行.

1) Puppeteer 提供了page.select() 方法，其中明确指出

"Triggers a change and input event once all the provided options have been selected"

我能够 select 预期的选项，但事件处理程序没有触发

await page.select('select#venue', '40');

2) 在 page.evaluate() 调用中使用原生 javascript 手动 select 所需的选项，然后生成一个新事件并手动使用 element.dispatchEvent(event ) 例如

document.querySelector('select#venue > option:nth-child(4)').selected = "selected";

const event = new Event('change', {bubbles: true});
event.simulated = true;

document.querySelector('select#venue').dispatchEvent(event));

3) 在 page.evaluate() 调用中使用 jQuery 手动 select 所需的选项，然后触发事件，例如

$("select#venue").val(17).change();

完全没有想法的人，感谢您的想法！

Answer 1

我正在搜索相同的东西，以触发文本字段上的“onchange”事件。我稍微修改了你的代码，它起作用了：

const myValue = 17;
await page.$eval('#selector', (element, myValue) => {
    element.value = myValue;
    const event = new Event('change');
    element.dispatchEvent(event);
}, myValue);

Puppeteer 调用 onChange 事件处理程序不工作

Puppeteer invoking onChange event handler not working

javascript

jquery

onchange

puppeteer