accordion JQuery không hoạt động mà không có thẻ h3

Question

Tôi đang cố gắng thực hiện một accordion với JQuery và đang chạy vào một số rắc rối. Trang web JQuery hiển thị để tạo nội dung accordion của bạn như thế này.

<div id="accordion"> 
    <a href="#">First header</a> 
    <div>First content</div> 
    <a href="#">Second header</a> 
    <div>Second content</div> 
</div> 

Khi tôi thực hiện điều này, accordion không hoạt động đúng và có vấn đề với định dạng. Nếu tôi đặt thẻ h3 xung quanh các neo tiêu đề như vậy

<div id="accordion"> 
    <h3><a href="#">First header</a></h3> 
    <div>First content</div> 
    <h3><a href="#">Second header</a></h3> 
    <div>Second content</div> 
</div> 

Nó hoạt động. Có ai biết tại sao điều này xảy ra không? Nó xảy ra trong Firefox 3.5 và IE 8. Tôi cũng vừa tải xuống các tệp JQuery ngay hôm nay.

-Cảm ơn

Answer 1

Bạn phải đặt mức độ thích hợp header option.

Trong trường hợp của bạn, bạn muốn sử dụng neo như các tiêu đề:

$('#accordion').accordion({ 
    header: "a" 
}); 

Answer 2

Bạn phải khởi accordion với các tùy chọn tiêu đề được chỉ định:

$('#accordion').accordion({ 
    header: 'a' 
}); 

Bạn cũng có thể muốn kiểm tra jQuery Accordion API để có thêm tùy chọn.

Answer 3

thử này để thay thế

<script> 

jQuery("#accordion").accordion({heightStyle: "content",header: 'h3' }); 

</script> 

Điều này sẽ hoạt động tốt trong IE