我想在自定义页面上添加日期选择器,但我无法工作。WP版本为3.2.1。这些是我在wp代码上使用的init字符串:
wp_enqueue_script(\'jquery\');
wp_enqueue_script(\'jquery-ui-core\');
wp_enqueue_script(\'jquery-ui-datepicker\', get_bloginfo(\'template_url\') . \'/js/jquery-ui-datepicker.min.js\', array(\'jquery\',\'jquery-ui-core\'));
wp_enqueue_style(\'jquery.ui.theme\', get_bloginfo(\'template_url\') . \'/js/smoothness/jquery-ui-1.8.16.custom.css\');
这些恩奎克生成以下代码:
<script type=\'text/javascript\' src=\'http://www.xxxxxxxx.it/wp-includes/js/jquery/jquery.js?ver=1.6.1\'></script>
<script type=\'text/javascript\' src=\'http://www.xxxxxxxx.it/wp-includes/js/jquery/ui.core.js?ver=1.8.12\'></script>
<script type=\'text/javascript\' src=\'http://www.xxxxxxxx.it/wp-content/themes/greyzed/js/jquery-ui-datepicker.min.js?ver=3.2.1\'></script>
<link rel=\'stylesheet\' id=\'jquery.ui.theme-css\' href=\'http://www.xxxxxxxx.it/wp-content/themes/greyzed/js/smoothness/jquery-ui-1.8.16.custom.css?ver=3.2.1\' type=\'text/css\' media=\'all\' />
在页面正文中,我使用以下代码:
<script type="text/javascript">
jQuery(\'#datepicker\').datepicker({
dateFormat : \'yy-mm-dd\'
});
</script>
<div class="row"><label for="day">Data</label><input type="text" id="datepicker" name="day" class="text" /></div>
日期选择器不工作。我不知道如何调试这个问题。它什么都不做,就像jQuery根本不存在一样。
UPDATE:
在你的帮助下,我成功地调试了代码。我将脚本放在div之后,并更改为:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(\'#datepicker\').datepicker({
dateFormat : \'yy-mm-dd\'
});
});
</script>
此代码在调用datepicker方法时出错,错误状态为:
Uncaught TypeError: Object [object Object] has no method \'datepicker\'
如果在javascript控制台上键入jQuery(“#datepicker”),我会得到以下结果:
[<input type="text" id="datepicker" name="day" class="text">]
除了那个错误之外,我没有发现其他错误,所有对jQuery的引用似乎都很好。
UPDATE 2:
我终于成功了!我必须放置“wp\\u print\\u scripts”而不是“init”,并且必须重新定位另一个冲突插件的一些init代码。唯一剩下的问题是主题。。。如果我在googlecode中使用基本主题,它就会起作用。如果我使用其他主题(嵌入wp或与wp\\u enqueque\\u样式链接),则不会加载主题。。。。如果我检查生成的html,没有迹象表明应该加载jQuery主题的行。
最合适的回答,由SO网友:v0idless 整理而成
我经常把东西打错。因此,我将开始调试您在浏览器中复制和粘贴指向JS脚本的链接,并确保它们已加载。
然后在Chrome中进入扳手菜单->工具->JavaScript控制台。在这里,您可以直接键入/执行JavaScript。我会开始打字jQuery
进入控制台以确保jQuery已实际加载。然后试着做jQuery(\'#datepicker\')
如果返回空括号[]
那么您的选择器失败了。如果可行,请尝试打开日期选择器-您可能会在JS控制台中看到错误。
像其他人所建议的那样,我认为问题在于脚本在实际渲染之前运行。我建议执行以下操作:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(\'#datepicker\').datepicker({
dateFormat : \'yy-mm-dd\'
});
});
</script>
这将强制脚本在加载整个页面后运行。
==示例==
add_action( \'init\', \'wp29r01_date_picker\' );
function wp29r01_date_picker() {
wp_enqueue_script( \'jquery\' );
wp_enqueue_script( \'jquery-ui-core\' );
wp_enqueue_script( \'jquery-datepicker\', \'http://jquery-ui.googlecode.com/svn/trunk/ui/jquery.ui.datepicker.js\', array(\'jquery\', \'jquery-ui-core\' ) );
}
add_action( \'wp_footer\', \'wp29r01_print_scripts\');
function wp29r01_print_scripts() {
?>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(\'#datepicker\').datepicker();
})
</script>
<?php
}