Wordpress，打开媒体库弹出窗口时初始化 jQuery 函数答案

【问题标题】：Wordpress, initialize jQuery function when media gallery popup is openedWordpress，打开媒体库弹出窗口时初始化 jQuery 函数
【发布时间】：2016-09-14 16:13:04
【问题描述】：

我正在我的主题中自定义一个标准的 Wordpress 库。添加了为缩略图选择边框颜色的选项（到图库设置列）并尝试使用内置的 Wordpress 颜色选择器。这就是我现在初始化颜色选择器的方式：

(function( $ ) {

    $(function() {
        $('body').on('click', '.color-field', function() {
        $('.color-field').wpColorPicker();
        });
    });

})( jQuery );

这是我现在可以让它工作的唯一方法。因为打开 Wordpress 媒体弹出窗口时会动态添加颜色字段。但是现在它仅在单击颜色字段时才被初始化。我正在寻找一种在加载媒体弹出窗口时初始化颜色选择器的方法。是否有任何可以使用的 Wordpress 弹出回调？

【问题讨论】：

当您说“媒体弹出”时，您是指媒体上传器吗？
是的。媒体上传器，图库标签。

标签： javascript jquery wordpress color-picker

【解决方案1】：

这应该是一个评论，但已经变得太大，但这不是一个正确的答案：

这是我目前也在努力整合到一个主题中的东西。在您的情况下，最简单/最快的方法可能是将您对 wpColorPicker 的点击调用附加到调用 media-uploader 的同一 div 标签上，或者您可以参考此 Is it possible to listen to a "style change" event? 并在 $('#__wp-uploader-id-2') div 的 css 时触发您的颜色选择器显示“块”属性更改。第二种方法是扩展厚盒功能（上传器位于厚盒内）以在上传器打开时进行回调。第三种方法是扩展媒体上传器的js功能，虽然我不熟悉。

如果有帮助，从长远来看，我发现处理 colorPickers 选项和布局控件需要做很多工作（我一次使用了几个），最后发现并实现了这个：https://acko.net/blog/farbtastic-jquery-color-picker-plug-in/

更新：从 https://wordpress.stackexchange.com/questions/92415/image-upload-callback-in-new-3-5-media 中发现，它扩展了上传者的回调函数：

$.extend( wp.Uploader.prototype, {
    init : function(){
        console.log( 'uploader is initialised' );
        $('.color-field').wpColorPicker(); // not sure exactly when it initialises ?
    },
    success : function(filename){
        console.log( 'uploader has loaded: '+ filename );
        $('.color-field').wpColorPicker(); // or you might want to add the colorbox once a file is actually uploaded?
    },
});

祝你好运

【讨论】：