如何捕获选择:切换wp.media激发的事件

时间:2017-06-04 作者:LubosB

我想不出监听这个事件的正确语法。我只是不知道它在哪里。我知道这是活动的名称,因为我正在记录每一个wp.media 使用我在堆栈上见过几次的函数的事件。

我可以在功能图像选择屏幕上捕获事件,因为我实际上知道语法:

wp.media.featuredImage.frame().on(\'selection:toggle\', function() {
    console.log(\'image selected\');
});
我需要知道用于常规插入媒体框的属性名称,以代替featuredImage. 你可能会认为这很容易找到,但大部分关于wp.media 处理构造和扩展。

Update - 此事件在源代码中的唯一外观是在媒体视图中。js:

toggleSelectionHandler: function( event ) {
    ...
    this.controller.trigger( \'selection:toggle\' );
},
此位于wp.media.view.Attachment. 我试着在控制台中遍历它,然后开火.on(\'all\') 但我得到的唯一回报是ready.

我看得越多wp.media, 似乎这个事件所做的一切都是宣布自己可供处理程序使用,如果这是正确的术语,而且据我所知,没有处理程序对它做任何事情,至少在wp.media 全局命名空间。

从网上提供的有限示例来看,似乎必须使用wp.media() 构造函数,然后指定on.select() 方法或者可能以某种方式扩展现有的媒体库功能,如果您可以在何处进行扩展的话。这一切对我来说都是陌生的。

Alternatively...

如果附件详细信息表单框架打开时有一个全局可用的事件,那么这可能适用于我的特定场景。因此,如果您知道此事件的语法,请与我们分享。

1 个回复
SO网友:Dave Romsey

我能拼凑出一些东西。我觉得有更好的方法来解决这个问题,但不管怎样,分享我的进展可能会有所帮助。

主要技巧来自this answer 作者:弗拉基米尔·卢基亚诺夫。

我对该解决方案的主要担忧是,取消选择事件,"selection:unsingle", 触发两次。我无法阻止这一切的发生。

另一个担忧是,可能有一种更干净的方法来实现这一点。然而,经过大量的搜索和实验,这是我最接近的解决方案。

add_action( \'admin_print_footer_scripts\', \'wpse_media_library_selection_toggle\' );
function wpse_media_library_selection_toggle() { ?>
<script type="text/javascript">
    ( function( $ ) {
        $( document ).ready( function() {

            // Ensure the wp.media object is set, otherwise we can\'t do anything.
            if ( wp.media ) {

                wp.media.featuredImage.frame().on(\'selection:toggle\', function() {
                        console.log( \'image selected\' );
                });

                // Ensure that the Modal is ready.
                wp.media.view.Modal.prototype.on( "ready", function() {
                    // console.log( "media modal ready" );

                    // Execute this code when a Modal is opened.
                    wp.media.view.Modal.prototype.on( "open", function() {
                        // console.log( "media modal open" );

                        // The sidebar boxes get deleted and recreated on each select - hack into this to do the same.
                        var selection = wp.media.frame.state().get( "selection" );
                        selection.on( "selection:single", function ( event ) {
                            console.log( "selection:single" );
                        } );

                        // Not sure why, but this fires twice...
                        selection.on( "selection:unsingle", function ( event ) {
                            console.log( "selection:unsingle" );
                        } );    

                    });

                    // Execute this code when a Modal is closed.
                    wp.media.view.Modal.prototype.on( "close", function() {
                         // console.log( "media modal close" );
                    });
                });
            }

        });
    })( jQuery );
</script><?php
}

结束