2013-07-04 60 views
9

我正在用自定义设置页面构建WordPress主题。某些设置要求用户上传/添加一组图像(多于1个)。媒体上传器的默认行为是上传和/或选择单个图像并将其插入到帖子中。WordPress 3.5媒体上传器多个文件选择

我跟着this excellent guide使用媒体上传器,它表明我应该能够设置多个为真,但它仍然只允许上传或选择单个文件。

这里是我的代码:

加载在需要的脚本,因为这是一个自定义的设置页面:

if(function_exists('wp_enqueue_media')){ 
    wp_enqueue_media(); 
}else{ 
    wp_enqueue_style('thickbox'); 
    wp_enqueue_script('media-upload'); 
    wp_enqueue_script('thickbox'); 
} 

的Javascript/jQuery的为了显示媒体上传和处理所选择的图像:

var tgm_media_frame; 

$('.upload-images').click(function() { 

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

    tgm_media_frame = wp.media.frames.tgm_media_frame = wp.media({ 
    multiple: true, 
    library: { 
     type: 'image' 
    }, 
    }); 

    tgm_media_frame.on('select', function(){ 
    var selection = tgm_media_frame.state().get('selection'); 
    selection.map(function(attachment) { 
     attachment = attachment.toJSON(); 
      console.log(attachment); 
      // Do something with attachment.id and/or attachment.url here 
    }); 
    }); 

    tgm_media_frame.open(); 

}); 

有没有人能够获得多个文件选择正常工作?我错过了什么吗?谢谢!

回答

11

更新

我觉得媒体上传已经更新,因为问题提出和回答。我猜在以前版本的wordpress multiple: 'add'选项不存在,正如其他用户所建议的。我不确定。


一切都很好,你的代码。只有一小部分失踪。

selection.map(function(attachment) { 
    attachment = attachment.toJSON(); 
    $("#something").after("<img src=" +attachment.url+">"); 
}); 

attachment后转换toJSON您可以使用它作为文件中提到。您可以将图片网址放入发布到服务器的某些隐藏字段中,并将选定图片同时显示给用户。

只是一个小事情,我觉得不可思议的是,我们需要按CTRL +点击选择图像。它应该是相当复选框或其他东西。


更新

CTRL + 点击 + 点击用于选择多个图像是wordpress的给予方式。仔细看看,开

... \ WP-包括\ JS \媒体views.js

有定义的函数 - toggleSelectionHandler。它监听按键组合用户已按下并据此调用其他改变某些类别的功能并导致实际选择。

检查到firbug后,你可以看到两个类应用 -

  1. selected
  2. details

details类定义样式当前点击/主动式选择(蓝色粗边框)和selected实际上将图像标记为选中并将其返回选择数组。

您可以从该文件本身更改该行为,也可以编写自己的函数来处理选择。第一种方法虽然不好。

PS:Wordpress实际上并未使用上述文件。它选择相同文件的压缩版本。所以你可能想要加载未压缩的文件并进行游戏。您可以强制WordPress的通过wp-config.php设置

define('SCRIPT_DEBUG', true); 

使用未压缩的js文件。这会跳过load-scripts.php的行为(通过合并将每个js文件的压缩版本压缩到单个文件中)。

+0

感谢您的信息SachinG,我不知道您必须按Shift +单击以选择媒体上载器中的多个图像。我已经在代码中实现了代码,当我选择多个图像时,“执行某些操作”。我只是希望人们不必按住Shift并点击来做到这一点!猜猜那里没有其他办法了? – Cory

+0

@Cory请看更新的答案。 – SachinGutte

+0

我们可以看到一个不涉及修改WP Core文件的版本吗? –

1

如果有人想知道如何做到这一点,一种方法是这样的。请注意,它将完全覆盖其实施范围内的默认行为。

wp.media.view.Attachment.prototype.toggleSelectionHandler = function(event) { 
    var method = 'between'; 
    if (event.shiftKey) { 
     method = 'between'; 
    } else { 
     method = 'toggle'; 
    } 

    this.toggleSelection({ 
     method: method 
    }); 
}; 

如果multiple设置为true那么这将允许您选择多个项目,如在画廊屏幕。

+0

只需一个字 - “完美!” –

11

您只需将multiple:true更改为multiple:'add'即可。这是默认创建图库的工作原理。

+2

这只是正确的答案。 'multiple:“toggle”'也可能是有趣的。 – lukkysam

+0

这是正确的答案。 ! –

+0

I think media uploader has been updated since question asked and answers。我想这个选项在以前的版本中不存在的wordpress。 – SachinGutte

相关问题