管理面板

Question

窗口小部件的管理部分呈现（服务器端）一次，之后WordPress将该HTML片段复制到例如页脚部分。

可能做这样的事情：

document.getElementById('widget-selector').innerHTML = '<div>My admin HTML</div>';

生成服务器端的唯一ID属性现在已经重复，我的前端严重依赖于JavaScript（jQuery），例如我的管理部分中特定元素的点击处理程序设置正在搞乱。

我可以使用：$('selector').last();但我不确定这是否是一种可靠的方法，因为它并不总是该选择器的最后一个元素。

关于如何获得正确选择器的任何想法或建议？

我希望我详细说明，如果我错过了某些内容，请告诉我，我会编辑我的问题。

修改

在了解StackOverflow和WordPress文档之后，WordPress会发出以下事件：widget-added每当在其中一个小部件部分上删除小部件时，这里都是一些示例代码。

$(document).on('widget-added', function(event, widget){
    const widgetId = $(widget).attr('id');
    /**
     * widgetId is something like widget-8_my-plugin-name-widget-7, 
     * inside that element is your widgets HTML, so check if this is your plugin
     */
    if (widgetId.match(/my-plugin-name/)) {
        /** 
        * i have a button with class .my-button somewhere in the widget
        * so make the following selector: #widget-8_my-plugin-name-widget-7 .my-button
        */ 
        $('#' + widgetId + ' .my-button').on('click', function() {
            console.log('test');
        });
    }
}); 

这解决了新小部件拖拽时的问题。放到小部件区域之一，我仍然在寻找一种可靠的方式来获取首次呈现的选择器（服务器端）。