2014-05-09 113 views
-1

當你點擊最初的鏈接去我的網站,然後在手風琴的網頁上出現手風琴,並根據要求隱藏1500。但是,當我點擊標題,使文本沒有出現。標題只是亮點。沒有錯誤,控制檯日誌狀態「準備好做一些jquery」,因爲我要求它做。我的視圖的jquery手風琴沒有顯示信息

部分

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
<script src="<?php echo base_url('/js/my_accordian.js'); ?>"></script> 

<div id="accordion">  
    <h2>Information</h2> 
    <p>more information</p> 
    <h2>Information 2</h2> 
    <p>more information 2</p>  
    <h2>Information 3</h2> 
    <p>more information 3</p> 
</div> 

JS

$(document).ready(function() { 
console.log("ready to do some jquery"); 
$('h2').addClass('exampleClass'); 
$('p').hide(1500); 
$("h2").click(function() { 
    $('.activeHeading').next().slideUp(400); 
    $('activeHeading').removeClass('activeHeading'); 
    $(this).addClass('activeHeading'); 
    $(this).next().slideToggle(400); 
}); 
}); 

CSS

body { 
    font-family:"Arial"; 
    font-size:0.8em; 
    color:black; 
    line-height:22px; 
    } 
h2 { 
    /*border-top:1px solid #999999; */ 
    padding:5px; 
    } 
.pageTitle { 
    font-family:"Garamond"; 
    color:#777777; 
    font-weight:lighter; 
    font-size:3em; 
} 
.activeHeading { 
    color:#00AAFF; 
} 
.exampleClass { 
    background-color:red; 
} 
.anotherExampleClass { 
    background-color:blue; 
} 

回答

0

更新代碼:http://jsfiddle.net/lotusgodkk/GCu2D/89/

<div id="accordion"> 
<h2>Information</h2> 
<p>more information</p> 
<h2>Information 2</h2> 
<p>more information 2</p> 
<h2>Information 3</h2> 
<p>more information 3</p> 
</div> 

JS:

$(document).ready(function() { 
console.log("ready to do some jquery"); 
$('h2').addClass('exampleClass'); 
$('p').hide(1500); 
$("h2").click(function() { 
    $('.activeHeading').next().slideUp(400); 
    $('.activeHeading').removeClass('activeHeading'); 
    $(this).addClass('activeHeading'); 
    $(this).next().slideToggle(400); 
}); 
}); 

更正:段增加關閉標籤。用$('.activeHeading')..代替$('activeHeading')...現在它是一個有效的選擇器。檢查這是否是你需要的。

0
$(document).ready(function() {   
    $('#accordion h2').addClass('exampleClass');  
    $('#accordion p').hide(); 
    $("#accordion h2").click(function() { 
     $("#accordion p").slideUp(); 
     $("#accordion h2").removeClass('activeHeading'); 
     $(this).addClass('activeHeading'); 
     $(this).next().slideToggle(400); 
    }); 
}); 


// YOUR ERROR 
// $('.activeHeading').next().slideUp(400); 
// $('activeHeading').removeClass('activeHeading');