javascript - Js 事件在 Elementor 插件中不起作用

Question

我正在为 WordPress 媒体库编写一个扩展，我需要向媒体库添加一个按钮，点击该按钮将打开一个模式窗口，用户可以从中选择图片。

看截图

• screenshot 1
• screenshot 2

目前，在使用 Elementor 插件编辑页面时，当库打开时单击按钮时不会触发该事件。 JS文件包含如下

public function registerAssets()
{
    //add_action('admin_enqueue_scripts', [$this, 'scripts']);
    add_action('wp_enqueue_scripts', [$this, 'scripts']);
}

public function scripts()
{
    wp_register_script( 'cbi-index-js', SCRIPTS_URI . 'index.js', [ 'elementor-frontend' ], '1.0.0', true );
    wp_enqueue_script('cbi-index-js');
}

在管理区域中一切正常，但在 Elementor 中，问题可能出在命名空间中。

JS文件

jQuery(document).ready(function ($){
  $('#db-upload-btn').on('click', function (e){
      alert(111)
  })
})
$('#db-upload-btn').on('click', function (e){
    alert(222)
})
console.log(333)

如您所见，我还向控制台输出了 console.log (333)，当我重新加载页面时，在 Elementor 面板中，向控制台输出了 333，这表明文件已连接，但为什么当我单击按钮时，处理程序不起作用，但我可以弄清楚。

有人可以帮我解决这个问题吗？

Answer 1

请将代码中的所有“$”字符替换为“jQuery”，然后重试!