在WordPress插件3.5上显示媒体上传器 [英] Display Media Uploader in Own Plugin on Wordpress 3.5

问题描述

在新的WordPress 3.5中，Media Uploader没有问题。我创建了自己的插件上传图片。我使用这段代码JS：

 < script type =text / javascript> 
 var file_frame; 
 $ b $ j jQuery（'。button-secondary'）。live（'click'，function（event）{
 
 event.preventDefault（）; 
 
 if（file_frame）{
 file_frame.open（）; 
 return; 
} 
 
 file_frame = wp.media.frames.file_frame = wp.media（
 {
 title：'Select File'，
 button：{
 text：jQuery（this）.data（'uploader_button_text'）
}，
 multiple ：false（
）
）; 
 
 file_frame.on（'select'，function（）{
 attachment = file_frame.state（）。get（'selection' ）.first（）。toJSON（）; 
 jQuery（'＃IMGsrc'）.val（attachment.url）; 
}）; 
 
 file_frame.open（）; 
}）; 
< / script> 
  

代码正常工作，但不幸的是表单看起来不完整。当我选择任何图片时，不会在右侧显示附件显示设置。我不知道为什么。我尝试添加媒体选项：

  displaySettings：true，
 displayUserSettings：true 
  

但它也行不通。

解决方案

这是我使用的代码。资料来源： http：// mikejolley.com/2012/12/using-the-new-wordpress-3-5-media-uploader-in-plugins/ 它似乎工作得很好，但左侧的侧栏已丢失。 （有意，但我不希望它）。

 <？php wp_enqueue_media（）; ？> 
 
< script> 
 
 function showAddPhotos（）{
 
 //上传文件
 var file_frame; 
 
 // event.preventDefault（）; 
 
 //如果媒体框架已经存在，请重新打开它。 
 if（file_frame）{
 file_frame.open（）; 
 return; 
} 
 
 //创建媒体框架。 
 file_frame = wp.media.frames.file_frame = wp.media（{
 title：jQuery（this）.data（'uploader_title'），
 button：{
 text： jQuery（this）.data（'uploader_button_text'），
}，
 multiple：false //设置为true允许选择多个文件
}）; 
 
 //选择图片后，运行回调。 
 file_frame.on（'select'，function（）{
 //我们将multiple设置为false，所以只能从上传器获得一张图片$ b $ attach = file_frame.state（）。get （）; toJSON（）; 
 
 //在这里用attachment.id和/或attachment.url做些事
}）; 
 
 //最后，打开模块
 file_frame.open（）; 
 
} 
< / script> 
  

I have little problem with Media Uploader in new WordPress 3.5. I created own plugin which is upload the picture. I'm using this code JS:

<script type="text/javascript">
    var file_frame;

    jQuery('.button-secondary').live('click', function( event ){

        event.preventDefault();

        if ( file_frame ) {
            file_frame.open();
            return;
        }

        file_frame = wp.media.frames.file_frame = wp.media(
            {
                title: 'Select File',
                button: {
                    text: jQuery( this ).data( 'uploader_button_text' )
                },
                multiple: false
            }
        );

        file_frame.on('select', function() {
            attachment = file_frame.state().get('selection').first().toJSON();
            jQuery('#IMGsrc').val(attachment.url);
        });

        file_frame.open();
    });
</script>

The code works fine, but unfortunately forms appears incomplete. When I select any picture doesn't show me 'Attachment Display Settings' on right side. I don't know why. I try add options to media:

displaySettings: true,
displayUserSettings: true

But it also doesn't work.

解决方案

This is the code I use. Source: http://mikejolley.com/2012/12/using-the-new-wordpress-3-5-media-uploader-in-plugins/ It seems to work pretty well, but the sidebar on the left is missing. (Intentional, but I don't want it anyways).

<?php wp_enqueue_media(); ?>

<script>

function showAddPhotos() {

// Uploading files
var file_frame;

// event.preventDefault();

// If the media frame already exists, reopen it.
if ( file_frame ) {
  file_frame.open();
  return;
}

// Create the media frame.
file_frame = wp.media.frames.file_frame = wp.media({
  title: jQuery( this ).data( 'uploader_title' ),
  button: {
    text: jQuery( this ).data( 'uploader_button_text' ),
  },
  multiple: false  // Set to true to allow multiple files to be selected
});

// When an image is selected, run a callback.
file_frame.on( 'select', function() {
  // We set multiple to false so only get one image from the uploader
  attachment = file_frame.state().get('selection').first().toJSON();

  // Do something with attachment.id and/or attachment.url here
});

// Finally, open the modal
file_frame.open();

}
</script>

这篇关于在WordPress插件3.5上显示媒体上传器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！