问题是您没有使用唯一ID(#tabs,#tabs-1…),因为小部件有多个实例(相同的ID由“可用小部件”区域中的实例使用)。
因此,只需将小部件实例ID前置或附加到您的标识符中,以使其唯一:
...
<div id="tabs-<?php echo $this->id; ?>">
<ul>
<li><a href="#tabs-<?php echo $this->id; ?>-1">Tab One</a></li>
<li><a href="#tabs-<?php echo $this->id; ?>-2">Tab Two</a></li>
</ul>
<div id="tabs-<?php echo $this->id; ?>-1">
<p><?php _e(\'Textbox 1\') ?>: <input class="widefat" name="<?php echo $this->get_field_name(\'text1\'); ?>" type="text" value="<?php echo esc_attr($text1); ?>" /></p>
<p><?php _e(\'Textarea 1\') ?>: <textarea class="widefat" name="<?php echo $this->get_field_name(\'textarea1\'); ?>" rows="8" cols="12"><?php echo esc_attr($textarea1); ?></textarea></p>
</div>
<div id="tabs-<?php echo $this->id; ?>-2">
<p><?php _e(\'Textbox 2\') ?>: <input class="widefat" name="<?php echo $this->get_field_name(\'text2\'); ?>" type="text" value="<?php echo esc_attr($text2); ?>" /></p>
<p><?php _e(\'Textarea 2\') ?>: <textarea class="widefat" name="<?php echo $this->get_field_name(\'textarea2\'); ?>" rows="8" cols="12"><?php echo esc_attr($textarea2); ?></textarea></p>
</div>
</div>
<script type="text/javascript">
jQuery(document).ready(function($){
$("#tabs-<?php echo $this->id; ?>").tabs();
});
</script>
...
此外,不确定WP 3.3是否已修复
this 问题,但在侧边栏中第一次拖动后,需要为
id
属性在form()函数中变为可用。