Question

我有一个来自Twitter Bootstrap 2.3.2文档的基于javascript的轮播，我在Wordpress主题中使用它。

我有两个实例，第一个实例，在主页上，工作正常，但另一个实例无法初始化引用“TypeError：$不是函数

$（document）.ready（function（）{“Firebug中的错误

这是标题中的代码：

<!doctype html>
<html <?php language_attributes(); ?>>
 <head>
 <meta charset="<?php bloginfo('charset');?>">
 <title><?php
global $page, $paged;
wp_title( '|', true, 'right' );
bloginfo( 'name' );
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) )
    echo " | $site_description";
if ( $paged >= 2 || $page >= 2 )
    echo ' | ' . sprintf( __( 'Page %s' ), max( $paged, $page ) );
?></title>

<link href="<?php echo get_template_directory_uri(); ?>/css/carousel.css" rel="stylesheet" type="text/css" media="all"/>
<link href="<?php echo get_template_directory_uri(); ?>/css/style.css" rel="stylesheet" type="text/css" media="all">
<script src="wp-content/themes/xxx/js/jquery-1.9.1.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/nav.js"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 15,
scrollwheel: false,
center: new google.maps.LatLng(13.094297,-59.601735),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);

</script>
<?php wp_head(); ?>

这是对象：

<div class="carousel-main">
<div class="carousel slide" id="myCarousel1">
<div class="carousel-inner inner-carousel">
<div class="item active"><img class="alignnone size-full wp-image-53" alt="vacationing-1" src="http://yyy.com/xxx/wp-content/uploads/2013/08/vacationing-1.jpg" width="800" height="350" /></div>
</div>
<a class="left carousel-control" href="#myCarousel1" data-slide="prev"></a>
<a class="right carousel-control" href="#myCarousel1" data-slide="next"></a>

</div>
</div>

这是页脚脚本：

<script type="text/javascript">
$(document).ready(function () {

$('#myCarousel, #myCarousel1').carousel('pause');
});
</script>

Answer 1

我认为你没有加载Jquery你能检查它是否加载了调试工具？请点击Chrome中的F12并查看是否正在加载Jquery消息$不是一个基本上说它找不到jquery的函数

Answer 2

为您的链接添加启动/，如下所示：

<script src="/wp-content/themes/xxx/js/jquery-1.9.1.min.js"></script>

Answer 3

首先检查页面中是否有jQuery（$）。

尝试用jQuery替换$

Answer 4

use class insted of id for multilple slider at single page

<script type="text/javascript">
$(document).ready(function () {
 $('.myCarousel').carousel();
});
</script>

Javascript幻灯片显示无法在多个页面上运行

4 个答案: