Question

这是我要尝试的操作，我有2个按钮和2个字段。这两个按钮具有相同的选择器，但具有不同的数据属性。我希望单击这些按钮之一时，它将获得该值并将其添加到其指定的文本字段中。我当前的代码仅在我单击的第一个字段上起作用，此后，如果我在第二个按钮上单击，它将不会在第二个字段上分配值，而是会在我首先选择的那个按钮上分配值。

这是我的字段：

第一个按钮及其指定的文本字段：

第二个按钮及其指定的文本字段：

rm -rf "$(ruby -e 'print RbConfig::CONFIG["rubylibdir"]')"/bundler{.rb,/} \
  "$(ruby -e 'print RbConfig::CONFIG["bindir"]')"/bundle{,r} \
  "$(ruby -e 'print Gem.dir')"/specifications/default/bundler-*.gemspec

jQuery(document).ready(function($) {
  var mediaUploader;
  $('.upload_image_button').on('click', function(e) {
    e.preventDefault();
    var buttonID = $(this).data('group');
    if (mediaUploader) {
      mediaUploader.open();
      return;
    }
    mediaUploader = wp.media.frames.file_frame = wp.media({
      title: 'Choose Image',
      button: {
        text: 'Choose Image'
      },
      multiple: false
    });
    mediaUploader.on('select', function() {
      var attachment = mediaUploader.state().get('selection').first().toJSON();
      $('#upload_image_' + buttonID).val(attachment.url);
    });
    mediaUploader.open();
  });
});

Answer 1

代码中包含一个if语句，该语句旨在防止媒体上传器重新初始化。

$cmd = escapeshellcmd('sudo /usr/bin/mysql -u [username] -e "create database somedb"');

删除此代码，以便在每次单击按钮时重新创建mediaUploader，而不是将存储的那个与初始值一起重新使用。

Answer 2

您可能想取消select之前的return;事件的绑定，@ JasonB的建议也很有效。我试图创建一个示例，但我不知道这是否有帮助：

jQuery(document).ready(function($) {
  var mediaUploader;
  var buttonID;
  $('.upload_image_button').on('click', function(e) {
    e.preventDefault();
    buttonID = $(this).data('group');
    if (mediaUploader) {
      $("select").unbind('change');
      console.log('open media');
      //return;
    }
    mediaUploader = 1;
    /*wp.media.frames.file_frame = wp.media({
          title: 'Choose Image',
          button: {
            text: 'Choose Image'
          },
          multiple: false
        });
        mediaUploader.on('select', function() {
          var attachment = mediaUploader.state().get('selection').first().toJSON();
          */
    $("select").on('change', function() {
      $('#upload_image_' + buttonID).val('value');
      alert();
    });
    /*
        });
        mediaUploader.open();*/
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="upload_image_1" type="text" name="upload_image_1" value="" class="regular-text">
<input type="button" class="upload_image_button button-primary" value="Insert Image" data-group="1">
<input id="upload_image_2" type="text" name="upload_image_2" value="" class="regular-text">
<input type="button" class="upload_image_button button-primary" value="Insert Image" data-group="2">
<select>
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>

多个具有相同功能的按钮将值分配给不同的文本字段

2 个答案: