首页 > 解决方案 > Wordpress - 向编辑器添加自定义媒体按钮不起作用。事件监听器没有捕捉到点击

问题描述

嗨,我正在尝试为用户做一个按钮来插入一个短代码模板,例如[commit_shortcode commit_ids=""]. 为了实现这一点,我在按钮旁边创建了一个Add Media按钮,名为Add Commit Lists. 在此处输入图像描述

但显然点击它不会触发事件来捕获和执行 js 脚本。

我如何为其添加按钮和 js 脚本:

        add_action('media_buttons', function() {
            echo '<button type="button" id="insert-my-commits" class="button insert-my-commits">Add Commit List</button>';
        }, 100);

        add_action( 'wp_enqueue_media', function (){
            wp_enqueue_script('media_button',
                OWD_VCS_MANAGER_PLUGIN_URL . 'assets/js/addCommitListButton.js',
                ['jquery'],
                '1.0.0',
                true);
        }, 100);

还有我用于处理向编辑器添加短代码的 js 脚本:

jQuery( function( $ ) {
    $( '.insert-my-commits' ).click( openMediaWindow );

    console.log('It is working here');
    
    acf.addAction( 'load', function() {
        $( '.insert-my-commits' ).on( 'click', function() {

            console.log('It is NEVER working here');
            
            openMediaWindow();
        } );
    } );

    function openMediaWindow() {
            wp.media.editor.insert('[commit_shortcode commit_ids=""]');
    }
} );

看起来有些东西正在捕获click事件并阻止我的脚本执行。如果有人有想法,我将非常感谢。我也在使用本教程:https ://www.sitepoint.com/adding-a-media-button-to-the-content-editor/

标签: javascriptphpjquerywordpressmouseevent

解决方案


推荐阅读