NOTA : Originalmente titulado " ¿Cómo permito que un controlador de botón" Haga clic "acceda a las variables definidas por el código que crea el botón? "

Tengo un código que se ejecuta en una página web de informes para un producto COTS a través de la función jQuery.ready(). Mi código tiene 2 partes: el código de "configuración" verifica un montón de requisitos previos y, si todas las condiciones son buenas, crea un botón y agrega un controlador de clic para el botón usando AddEventListener. La segunda parte es el controlador de clics. En eso necesito la mayoría de las mismas variables que definí en la parte de "configuración". La forma rápida y sucia de hacerlo es simplemente copiar el código de la "configuración", pero eso parece ineficiente y propenso a errores si cambio algo en la parte de "configuración" y me olvido de replicarlo en el "controlador de clics".

¿Hay alguna manera de pasar las variables que defino en la sección "configuración" a un evento asíncrono como un controlador de clics?

 // the click handler const delAllSelected = () => { // In here I also need the "top_frame", "rpt_doc", "tbl_rptOutput" variables // defined in the "setup" portion. // ... do stuff ... } // setup portion jQuery(document).ready(function () { var top_frame= top.window.document.querySelector("[name*=reportDialog]"); var rpt_doc = top?.window?.frames[0]?.frames["List"]?.document; var tbl_rptOutput = rpt_doc.querySelector("#ReportOutput"); ...etc... // if all the stars align, create a button and attach click handler if (all conditions good) { rpt_doc.querySelector("#CheckboxButtons td.btnFrame").insertAdjacentHTML("beforeend",` ... html for the "Delete All Selected" button goes here ... `); tbl_rptOutput.querySelector("#DeleteAllSelected").addEventListener("click",delAllSelected); } }