油脂猴 - 将 onclick 事件添加到现有按钮答案

【问题标题】：greasemonkey - adding onclick event to existing button油脂猴 - 将 onclick 事件添加到现有按钮
【发布时间】：2016-10-23 16:05:33
【问题描述】：

我目前正在编写一个 Greasemonkey 脚本，以将 onclick 事件添加到现有按钮，以显示确认弹出窗口。

这是现有的html：

<input type="button" id="previewOrder" title="" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false" value="Preview Order">

我想出了以下 javascript，但它不起作用或失败

function confirm () {
    alert ("Sure?");
}

document.getElementById("previewOrder").addEventListener("click", confirm(), false);

关于如何使它工作的任何建议？

【问题讨论】：

你不能调用你的函数确认，这无论如何都是 vauge。称之为有意义的事情并避免冲突。

标签： javascript onclick

【解决方案1】：

confirm() 是 native 窗口方法。因此把它放在一个函数中：

function myFunction() {
    confirm( ... );
}

示例：

function myFunction() {
  confirm("Sure?");
}

document.getElementById("previewOrder").addEventListener("click", myFunction);

&lt;input type="button" id="previewOrder" title="" class="ui-button ui-widget ui-state-default ui-corner-all" role="button" aria-disabled="false" value="Preview Order"&gt;

【讨论】：

应该可以！您必须将 JavaScript 放在 <body> 的末尾 <input> 之后。我添加了一个例子！

【解决方案2】：

感谢您的帮助。最后，它在我这边不起作用的原因似乎是脚本是在页面（特别是目标元素）加载之前执行的。添加 waitForKeyElements() 实用程序后，代码正在运行。

见https://stackoverflow.com/a/12899331/3149095

function myConfirm () {
confirm ("Sure?\n\nCheck rules.\n\n");
}

function setConfirm () {
document.getElementById("previewOrder").addEventListener("click", myConfirm);
}

waitForKeyElements ("#previewOrder", setConfirm);

【讨论】：