在頁面上使用幾個Wordpress上傳表單

Question

我正在開發一個Wordpress插件。使用WordPress的'上傳系統。 基本上這是我的形式輸入，用於上傳：

<input id="upload_image" type="text" value="" /> 
<input id="upload_image_button" type="button" value="Upload Image" /> 

另外其他所需js和排隊CSS文件（包括在內）。最後，這個JavaScript包含在頁面：

jQuery(document).ready(function() { 

jQuery('#upload_image_button').click(function() { 
formfield = jQuery('#upload_image').attr('name'); 
// show Wordpress' uploader modal box 
tb_show('', 'media-upload.php?type=image&TB_iframe=true'); 
return false; 
}); 

window.send_to_editor = function(html) { 
// this will execute automatically when a image uploaded and then clicked to 'insert to post' button 
imgurl = jQuery('img',html).attr('src'); 
// put uploaded image's url to #upload_image 
jQuery('#upload_image').val(imgurl); 
tb_remove(); 
} 

}); 

它工作得很好，沒問題。但是現在我想添加一些上傳表單到頁面。

<input class="upload_image" type="text" value="" /> 
<input class="upload_image_button" type="button" value="Upload Image" /> 

<input id="upload_image" type="text" value="" /> 
<input id="upload_image_button" type="button" value="Upload Image" /> 

<input id="upload_image" type="text" value="" /> 
<input id="upload_image_button" type="button" value="Upload Image" /> 

我用class="upload_image"和class="upload_image_button"代替id="upload_image"和id="upload_image_button"

現在我有更新我的JavaScript代碼。

現在有幾個上傳按鈕。 BUt這是行不通的：

jQuery(document).ready(function() { 

jQuery('.upload_image_button').click(function() { 
formfield = jQuery('.upload_image_button').prev().attr('name'); 
tb_show('', 'media-upload.php?type=image&TB_iframe=true'); 
return false; 
}); 

window.send_to_editor = function(html) { 
imgurl = jQuery('img',html).attr('src'); 
jQuery('.upload_image_button').prev().val(imgurl); 
tb_remove(); 
} 
}); 

我應該如何更新它？

Answer 1

jQuery(document).ready(function() { 
var clicked = null; 

jQuery('.upload_image_button').click(function() { 
clicked = jQuery(this); 
formfield = jQuery(this).prev('input').attr('name'); 
tb_show('', 'media-upload.php?type=image&TB_iframe=true'); 
return false; 
}); 

window.send_to_editor = function(html) { 
imgurl = jQuery('img',html).attr('src'); 
clicked.prev('input').val(imgurl); 
tb_remove(); 
} 
});