javascript - 如何将 JavaScript 事件处理程序附加到对话框弹出窗口？

Question

好的，这就是问题所在。我有一个 jqGrid 对话框，只有在您单击“添加记录”按钮后才会在 HTML 中生成。

我在该对话框中的一个按钮上附加了一个“单击”事件处理程序，以便在单击时打开一个弹出窗口（这是在文档准备好后完成的），但它不起作用，因为当页面加载时，事件处理程序由 IE 处理并且它看到该对话框目前不存在并删除或取消当前无效的处理程序。

当页面加载时它不存在时，如何将 JavaScript 事件处理程序附加到该对话框（或任何元素）以执行功能？

Answer 1

If you can put some part of the dialog (even just a placeholder div where you will insert the dialog's HTML) in the HTML that loads at page load, you can use delegated events in jQuery to attach event handlers to descendant elements that don't exist in the DOM at page load (like your dialog's elements).

See jQuery documentation for on().

This will bind an event handler to the click event for a button with ID myButtonId added to the DOM at any point in the future as long as it is inside the placeholder div:

<div id="divPlaceholder"><!-- dialog will be inserted into DOM here --></div>

<script type="text/javascript">
    $($("#divPlaceholder").on("click", "#myButtonId", function() {
        window.open(...);
    }));
</script>

Alternatively, whatever script you have running when the user clicks "add records" in order to display the jqGrid dialog could display the dialog, then add the event handler directly to the button.