WordPress使用Media uploader 3.5将多个图像上传到输入

时间:2014-01-23 17:47:18

标签: javascript php jquery wordpress file-upload

所以我使用WordPress Media Upload 3.5将图像上传到输入字段(文本,尝试隐藏不起作用)。现在,我的目标是让用户通过Media-Upload 3.5选择一些图像,然后按下上传后,将图像属性拉到输入字段,然后从上传。

这是我提取媒体上传iframe的代码。你会看到我尝试了很多选择:

  jQuery(document).ready(function(){

var file_frame;
var wp_media_post_id = wp.media.model.settings.post.id; // Store the old id
var set_to_post_id = 10; // Set this

  jQuery('.upload_image_button').live('click', function( event ){

    event.preventDefault();

    // If the media frame already exists, reopen it.
    if ( file_frame ) {
      // Set the post ID to what we want
      file_frame.uploader.uploader.param( 'post_id', set_to_post_id );
      // Open frame
      file_frame.open();
      return;
    } else {
      // Set the wp.media post id so the uploader grabs the ID we want when initialised
      wp.media.model.settings.post.id = set_to_post_id;
    }

    // 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: true  // Set to true to allow multiple files to be selected
    });

    // When an image is selected, run a callback.
    file_frame.on( 'open', function() {
      // We set multiple to false so only get one image from the uploader
      //attachment = file_frame.state().get('selection').first().toJSON();
//$("#image99").after("<img src=" +attachment.url+">");
      // Do something with attachment.id and/or attachment.url here
       var selection = file_frame.state().get('selection');
  ids = jQuery('#image99').val().split(',');
    ids.forEach(function(id) {
  attachment = wp.media.attachment(id);
  attachment.fetch();
  selection.add( attachment ? [ attachment ] : [] );
});
      // Restore the main post ID
      //wp.media.model.settings.post.id = wp_media_post_id;
    });

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

  // Restore the main ID when the add media button is pressed
  jQuery('a.add_media').on('click', function() {
    wp.media.model.settings.post.id = wp_media_post_id;
  });   

 });

这是我输入的文本代码:

    <input id="image99" name="images[99][image]" type="text"  value="" /> 
<input class="upload_image_button" id="images[99][image]" type="button" value="Upload">

所以上传过程效果很好但是它只会拉出通过而不是其余的第一张图像。

0 个答案:

没有答案