Question

我在元数据库中有超过5个标签。在每个元数据库中，我都有一个用于图像变化的引导模式，其中包含一些输入和一个类为.btn.select_media_的按钮以及一个包含该选项卡唯一ID的data-id属性。我点击这个按钮打开wp上传器。请看我的JS代码。

var mediaUploader;
$(document).on('click','.btn.select_media_',function(e){
    e.preventDefault();
    var id=$(this).data('id');
    // If the uploader object has already been created, reopen the dialog
    console.log('clicked:'+id);
    if (mediaUploader) {
      mediaUploader.open();
      return;
    }
    // Extend the wp.media object
    mediaUploader = wp.media.frames.file_frame = wp.media({
    ///mediaUploader = wp.media.frames.mediaUploader = wp.media({
      title: 'Choose Image',
      button: {
      text: 'Choose Image'
    }, multiple: false });

    mediaUploader.on('select', function() {
      attachment = mediaUploader.state().get('selection').first().toJSON();
      $('#img_url_'+ id).val(attachment.url);
      $('#img_width_'+ id).val(attachment.width+'px');
      $('#img_title_'+ id).val(attachment.title);
      $('#show_img_'+ id).attr('src',attachment.url);
      console.log('selected'+ id);
    });
    // Open the uploader dialog
    mediaUploader.open();
});

问题是当我在任何一个标签中设置/上传图像时，此功能运行并在mideaUploader.on('select')事件中设置图像的值。当我尝试在其他选项卡中选择图像时，我在控制台中注意到console.log('selected'+ id);具有旧值（我在第一次设置的选项卡上），console.log('clicked'+ id);具有较新的ID值。

请帮忙！我的代码出了什么问题？如何在此处理程序的顶部和底部获得相同的值？

Answer 1

它很好我通过声明global object并为此对象指定data-id值来解决我的问题。

调用wordpress媒体上传器的最佳做法是什么（wp.media）

1 个答案: