0

我在 WordPress 定制器中添加了一些控件，包括一个 img、一个 input:text 字段和一个按钮。单击时，我希望该按钮打开媒体库并允许上传 pdf。选择 pdf 后，我想用 pdf 的 url 填充 input:text 字段，用预览图像填充 img 字段。

我使用以下代码处理图像，但如果我尝试使用 pdf，它会将 url 更改为最后包含 .jpg 而不是 .pdf。

我的代码如下：

    'use strict';
    jQuery('body').on('click', button_class, function () {
        var button_id = '#' + jQuery(this).attr('id');
         var pdf_image = jQuery(this).parent().children('img');
        var pdf_field = jQuery(this).parent().children('input:text');
        var _custom_media = true;

        wp.media.editor.send.attachment = function (props, attachment) {

            if (_custom_media) {
                if (typeof pdf_field !== 'undefined' || typeof pdf_image !== 'undefined') {
                    switch (props.size) {
                        case 'full':
                            pdf_field.val(attachment.sizes.full.url);
                            pdf_field.trigger('change');
                            pdf_image.attr("src", attachment.sizes.full.url);
                            pdf_image.trigger('change');
                            break;
                        case 'medium':
                            pdf_field.val(attachment.sizes.medium.url);
                            pdf_field.trigger('change');
                pdf_image.attr("src", attachment.sizes.medium.url);
                            pdf_image.trigger('change');
                            break;
                        case 'thumbnail':
                            pdf_field.val(attachment.sizes.thumbnail.url);
                            pdf_field.trigger('change');
                        pdf_image.attr("src", attachment.sizes.thumbnail.url);
                            pdf_image.trigger('change');
                            break;
                        default:
                            pdf_field.val(attachment.url);
                            
                            pdf_field.trigger('change');
                            pdf_image.attr("src", attachment.url);
                            pdf_image.trigger('change');
                            
                            
                    }
                }
                _custom_media = false;
            } else {
                return wp.media.editor.send.attachment(button_id, [props, attachment]);
            }
        };
        wp.media.editor.open(button_class);
        window.send_to_editor = function (html) {

        };
        
        return false;
    });
}

谁能建议我如何修改它以使用pdf？

我遇到的另一个问题是，这会打开带有所有选项的媒体框架，包括左侧的“操作”列以及创建画廊、创建音频播放列表等选项。是否可以修改所包含内容的选项在框架中？

编辑

我设法让这种工作：

function pdf_upload(button_class) {
'use strict';
jQuery('body').on('click', button_class, function () {
     var button_id = '#' + jQuery(this).attr('id');

var pdf_image = jQuery(this).parent().children('img');
    var pdf_field = 
jQuery(this).parent().children('input:text');
var input = jQuery(this);

// Create the media frame.
   var items_frame = wp.media.frames.file_frame = wp.media({
    title: 'Add PDF',
    button: {
        text: 'Select'
    },
    
    library: {
        
        type:['application/pdf', 'image']
    },
    
});



items_frame.on('select', function() {


 var   attachment = items_frame.state().get('selection').first().toJSON();
    pdf_field.val(attachment.url);
             console.log(attachment);           
                      
                        pdf_image.attr("src", attachment.url);
                        pdf_image.trigger('change');
                        pdf_field.val(attachment.url);
                         pdf_field.trigger('change');
             
});
  // Finally, open the modal.
items_frame.open();

});
    
};

此代码打开没有我想要删除的选项的媒体框架，并返回 pdf url。但是，我现在遇到了相反的问题，因为 .pdf 不是图像，所以我想用预览图像填充的字段不显示。所以我需要以某种方式返回另一个值，比如在我的原始代码中返回预览图像的 jpg 版本，但我没有看到如何做到这一点。

4

0 回答 0