我正忙于构建自己的 Wordpress 小部件。除了 Wordpress 媒体上传器之外，一切正常。我创建了八个按钮和八个输入文本字段，其中应包含已上传图像的 url。
click 事件没有被触发，可能是因为 Wordpress 输出 HTML 两次（一次在可用小部件的栏中，一次在当前活动小部件的栏中）。
有人看到我做错了吗？
您可以在下面找到我的代码。
在此先感谢您的帮助！
<?php
/*
Plugin Name: Home_Rollover_Widget
Plugin URI:
Description: Home Rollover Widget
Version: 1.0
Author:
Author URI:
*/
// Initialize widget
add_action('widgets_init', array('Home_Rollover_Widget', 'register'));
/**
* Home_Rollover_Widget
*
* @package
* @author
* @copyright 2012
* @version $Id$
* @access public
*/
class Home_Rollover_Widget extends WP_Widget
{
/**
* __construct()
*
* @return void
*/
public function __construct()
{
parent::__construct('home-rollover-widget');
}
/**
* control()
*
* @return void
*/
public function control()
{
// Load upload an thickbox script
wp_enqueue_script('media-upload');
wp_enqueue_script('thickbox');
// Load thickbox CSS
wp_enqueue_style('thickbox');
// Load all widget options
$data = get_option('Home_Rollover_Widget');
?>
<!-- Widget title -->
<p><label>Titel<input name="home_rollover_widget_title" type="text" value="<?php echo $data['home_rollover_widget_title']; ?>" /></label></p>
<?php
// If there's a title provided, update it.
if (isset($_POST['home_rollover_widget_title'])){
$data['home_rollover_widget_title'] = attribute_escape($_POST['home_rollover_widget_title']);
}
// Show 8 input groups for image URL and text
for ($i = 1; $i <= 8; ++$i)
{
?>
<p><a href="#" id="upload-button-<?php echo $i; ?>">UPLOAD IMAGE</a></p>
<p><label>IMAGE <?php echo $i; ?><input id="home_rollover_widget_image_url_<?php echo $i; ?>" name="home_rollover_widget_image_url_<?php echo $i; ?>" type="text" value="<?php echo $data['home_rollover_widget_image_url_'.$i]; ?>" /></label></p>
<p><label>TEXT <?php echo $i; ?><input name="home_rollover_widget_text_<?php echo $i; ?>" type="text" value="<?php echo $data['home_rollover_widget_text_'.$i]; ?>" /></label></p>
<?php
// If there's an URL provided, update it.
if (isset($_POST['home_rollover_widget_image_url_'.$i])){
$data['home_rollover_widget_image_url_1'] = attribute_escape($_POST['home_rollover_widget_image_url_'.$i]);
}
// if there's a text provided, update it.
if (isset($_POST['home_rollover_widget_text_'.$i])) {
$data['home_rollover_widget_text_1'] = attribute_escape($_POST['home_rollover_widget_text_'.$i]);
}
?>
<script type="text/javascript">
var formField = '';
var imgUrl ='';
jQuery(document).ready(function() {
jQuery('#upload-button-<?php echo $i; ?>').click(function() {
alert('Clicked on upload button');
formField = jQuery('#upload-button-<?php echo $i; ?>').attr('name');
tb_show('', 'media-upload.php?type=image&&TB_iframe=1');
return false;
});
// send url back to plugin editor
window.send_to_editor = function(html) {
imgUrl = jQuery('img',html).attr('src');
alert('Sending image url'+imgUrl+' to text field');
jQuery('#home_rollover_widget_image_url_<?php echo $i; ?>').val(imgUrl);
tb_remove();
}
});
</script>
<hr />
<?php
}
// Update widget data
update_option('Home_Rollover_Widget', $data);
}
/**
* widget()
*
* @param mixed $args
* @return void
*/
function widget($args)
{
// Load all widget options
$data = get_option('Home_Rollover_Widget');
?>
<h4><?php echo $data['home_rollover_widget_title']; ?></h4>
<div id="all">
<?php
// Loop though the widget elements
for ($i = 1; $i <= 8; ++$i)
{
// Find image URL
$imageUrl = $data['home_rollover_widget_image_url_'.$i];
// Check for first slash, if not present, add it.
if (substr($imageUrl, 0, 1) != '/') {
$imageUrl = '/'.$imageUrl;
}
?>
<ul>
<li><a href="#"><img src="<?php echo get_template_directory_uri(); ?><?php echo $imageUrl; ?>" /><h4><?php echo $data['home_rollover_widget_text_'.$i]; ?></h4></a></li>
</ul>
<?php
}
?>
</div>
<?php
}
/**
* register()
*
* @return void
*/
function register()
{
// Register for sidebar
register_sidebar_widget('Home Rollover Widget', array('Home_Rollover_Widget', 'widget'));
// Register for control panel
register_widget_control('Home Rollover Widget', array('Home_Rollover_Widget', 'control'));
}
}