jQuery（内容滑块）在WordPress模板中不工作 问题

我在Wordpress模板页面中添加了一个jQuery内容滑块（Coda slider 2.0），但它会中断（只显示文本“加载”）

演示 我在这里提供了一些实例，以查看我的代码的运行情况：

|

我试过的 我试着用美元符号代替我头脑中的“jQuery”，但没有用

<!--Slider-->
<!-- Begin Stylesheets -->
    <!--<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory') ?>/js/coda-slider/stylesheets/reset.css" type="text/css" media="screen" />-->
            <!--Commented out because it's already called previously.-->
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory') ?>/js/coda-slider/stylesheets/coda-slider-2.0.css" type="text/css" media="screen" />
<!-- End Stylesheets -->

<!-- Begin JavaScript -->
    <!--<script type="text/javascript" src="<?php bloginfo('stylesheet_directory') ?>/js/coda-slider/javascripts/jquery-1.3.2.min.js"></script>-->
    <script type="text/javascript" src="<?php bloginfo('stylesheet_directory') ?>/js/coda-slider/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="<?php bloginfo('stylesheet_directory') ?>/js/coda-slider/javascripts/jquery.coda-slider-2.0.js"></script>
    <script type="text/javascript">
        jQuery().ready(function() {
            jQuery('#coda-slider-1').codaSlider(
            {autoSlide: true, 
            autoHeight: false, 
            autoSlideStopWhenClicked: true, 
            autoSlideInterval:4000,
            dynamicArrows: false,
            dynamicTabs: false}
            );
        });
     </script>
<!-- End JavaScript -->

您的目标是
coda-slider-1
，但您的容器div是
coda-slider-wrapper
（除非我在这里遗漏了一些明显的东西）。这肯定会把事情搞砸。尝试：

$(document).ready(function() {
            $('div#coda-slider-wrapper').codaSlider(
            {...
            );
        });



（无关）你也可以考虑把你的行为推到一个外部的JS文档中。另外，插入javascript的首选方法是通过
wp\u enqueue\u scripts
，您可以在
functions.php中对其执行添加操作。
只是一个想法；）

@markratledge绝对正确，另外-
404未找到错误
。萤火虫是你的朋友

更新

为了确保将javascript正确插入到头中，wordpress首先注册，然后将所有需要的脚本排队。插入自定义脚本的正确方法是
将_action
添加到wp的内置方法中。手动插入脚本将起作用，但您可能会干扰任何本机脚本嵌入。无论如何：这是thickbox jquery插件的一个示例，它的通用性足以用于任何js。您可以将其添加到主题的
functions.php
脚本中，或添加到自定义插件中，或添加到任何您的案例中

// register scripts 
if (! function_exists(thickbox_register){
function thickbox_register() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery','http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js');
    wp_register_script( 'thickbox', 'path to thickbox'.thickbox.js, 'jquery');
    }  
}   
add_action('init', 'thickbox_register');

//print the now registered scripts 
if (! function_exists(thickbox_enqueue){
function thickbox_enqueue() {
    wp_enqueue_script( 'jquery' );
    wp_enqueue_script( 'thickbox' );
    }  
}
add_action('wp_print_scripts', 'thickbox_enqueue');

这样试试看

$(function(){
         $('#coda-slider-1').codaSlider({
                autoSlide: true, 
                autoHeight: false, 
                autoSlideStopWhenClicked: true, 
                autoSlideInterval:4000,
                dynamicArrows: false,
                dynamicTabs: false
         });
});

与Firefox一起使用，或者在Chrome、Safari或IE8中，使用开发人员工具检查演示中不起作用的JS错误。现在，JS easing库由于404而没有加载。
感谢您的建议，尽管我已经仔细检查了它，coda-slider-1确实是目标。请看这里：我很高兴使用你关于wp_enqueue_脚本的建议，但是你能简单地解释一下它的好处吗？看起来你已经解决了。什么问题？谢谢你。虽然这不是问题的根源，但这是避免美元符号冲突的一个非常有用的方法。谢谢。我使用Chrome进行调试，找到了您提到的404。果然，我通往图书馆的路径缺少一个目录。