Question

我的wordpress主题中有一堆元框。点击按钮w / class =“meta_upload_button”我想启动默认媒体上传器。感谢一些在线教程，我有一部分主要工作。我正在尝试调整代码以适用于多个输入/按钮对。

<input type="text" />
<button type="button" class="meta_upload_button">Upload</button>

ID，名称和值都是由WPAlchemy MetaBox类动态生成的。

问题是我的代码正在改变最后一个文本输入字段的值，无论我点击哪个按钮，这让我觉得这是一个jquery选择问题。但是我使用了我喜欢的颜色调试方法，并在点击按钮之前的输入框中应用了边框颜色。工作得很好。但是在send_to_editor函数中，相同的声明不会选择正确的输入。

var ww = $('#post_id_reference').text();

$('.meta_upload_button').each(function() {

 var button = $(this);

 $(this).click(function() {

  //test- result= changes border color on correct input
        button.prev('input').css("border","3px solid red");


  window.send_to_editor=window.send_to_editor_clone;
  tb_show('', 'media-upload.php?post_id=' + ww + '&type=image&TB_iframe=true');
  return false;
 });

  //my version of the send_to_editor
 window.send_to_editor_clone = function(html){
        //grabs the URL of the selected image
  imgurl = $('img',html).attr('src');

  forminput = button.prev('input');

        //changes the value on the LAST input 
  forminput.val(imgurl);
  tb_remove();
 }

}); //end each

Answer 1

好的，我想我知道问题是什么。

$('.meta_upload_button').each

为每个按钮运行一次该函数的主体。每次运行时，变量

window.send_to_editor_clone

设置为一些应该填充文本字段的函数。但是，只有一个窗口，因此 window.send_to_editor 将等于它分配的最后一个值。在这种情况下，它是按钮具有它将具有的最后一个值的功能 - 即，它是最后一个按钮，这是您描述的行为。

你是如何解决的？我不太确定。您是否只能通过 window.send_to_editor（html）访问此内容？理想情况下，您只需定义该函数一次，但将特定按钮作为参数传递给它。

搜索 send_to_editor 并没有告诉我如何解决这个问题。您可以按照以下方式执行此操作：

var ww = $('#post_id_reference').text();

var which_button;

$('.meta_upload_button').each(function() {

 var button = $(this);

 $(this).click(function() {
   which_button = button;    


  tb_show('', 'media-upload.php?post_id=' + ww + '&type=image&TB_iframe=true');
  return false;
 });
}); //end each

//my version of the send_to_editor
window.send_to_editor_clone = function(html){
  //grabs the URL of the selected image
  imgurl = $('img',html).attr('src');

  forminput = which_button.prev('input');

  //changes the value on the LAST input 
  forminput.val(imgurl);
  tb_remove();
}
window.send_to_editor=window.send_to_editor_clone;

只有在点击处理程序后调用 window.send_to_editor 时才会有效。否则，处理起来就会变得更糟糕。我认为，使用setTimeOut是可能的，但在那一点上它变成了一个并发性的东西，更难以思考。

Answer 2

@forefinger - 非常感谢你！我现在使用每个问题都有意义，我永远不会看到这个问题。我也会发誓说我尝试了类似于哪个的东西，但是我今天醒来，看到了你的答案 - 并且繁荣起来了！

var ww = $('input[name=post_ID]').val();

$('.meta_upload_button').each(function() {

    var button = $(this);

    $(this).click(function() {
        which_button = button;
        window.send_to_editor=window.send_to_editor_clone;
        tb_show('', 'media-upload.php?post_id=' + ww + '&type=image&TB_iframe=true');
        return false;
    });


    window.send_to_editor_clone = function(html){
        imgurl = $('img',html).attr('src');
        forminput = which_button.prev('input');
        forminput.val(imgurl);

        tb_remove();
    }

}); //end each

send_to_editor是另一个几乎没有任何文档的wordpress函数。但是上面，我需要将克隆的send_to_editor保留在click函数中，以便仅在单击metabox中的按钮时调用它，并且不会干扰常规帖子上的媒体按钮。

关于wordpress元框输入字段的jquery

2 个答案: