jquery - 手风琴在标签 ui 中不刷新

Question

我无法将手风琴的大小调整到选项卡中的内容。我看到了这篇文章，并认为我可以在单击选项卡时通过简单的刷新来做到这一点：http: //bugs.jqueryui.com/ticket/3905。我已经尝试了几种方法来让隐藏的选项卡显示手风琴，第一个 H3 的大小适合内容，但我无法让它工作。

谢谢！

<div class="tab-set" style="display:none;">  
<ul> 
    <li><a href="#States">States</a></li> 
    <li><a href="#Trending">Trending</a></li>
    <li><a href="#Map" onclick="setTimeout(function() {initialize();}, 100);">Map</a></li>    
    <li><a href="#Cities">Cities</a></li>
    <li><a href="#NationalPark">National Parks</a></li>
    <li><a href="#StatePark">State Parks</a></li>
    <li><a href="#Information" onclick="$('#accordion').accordion.refresh()">Information</a></li>
</ul>
<!-- Hot Locations -->
<div id="Trending">
</div>
<!-- States -->
<div id="States">
</div>
<!-- Map -->
<div id="Map">    
</div>  
<!-- Cities -->      
<div id="Cities"> 
</div>
<!-- National Parks -->
<div id="NationalPark">
</div>
<div id="StatePark">
</div>
<div id="Information">
    <div id="accordion">
        <h3>Description</h3>
        <p>
        Almost 70 miles (113 km) west of Key West lies the remote Dry Tortugas National Park. The 100-square mile park is mostly open water with seven small islands.  Accessible only by boat or seaplane, the park is known the world over as the home of magnificent Fort Jefferson, picturesque blue waters, superlative coral reefs and marine life,  and the vast assortment of bird life that frequent the area.                
        </p>
        <h3>Operating Hours</h3>
        <p>
        Dry Tortugas National Park is open year-round
        The following limitations apply to specific areas within the park boundary:
        Garden Key is open year round 24 hours a day.
        Ft. Jefferson, on Garden Key, is open year-round from sunrise to sunset.
        Loggerhead Key is open to day visitors year round from sunrise to sunset. All other facilities on the island, including Loggerhead Lighthouse are closed to the public.
        Bush Key is open to visitors October 15th to January 15th from sunrise to sunset.
        Hospital Key, and Long Key are closed year round and visitors should remain 100 feet offshore of all closed islands.
        Middle and East Keys are open to visitors October 16 to March 31 from sunrise to sunset.                
        </p>
        <h3>Fees</h3>
        <p>
        Entrance Fee
        The entrance fee for the park is $5.00 for visitors 16 and older. This fee covers entrance to the park for 7 days.
        Entrance Fee Collection
        Currently, the Yankee Freedom Ferry and Key West Seaplane Adventures collect the park entrance fee from their passengers. If you are the proud owner of a National Parks Pass, Golden Eagle, Golden Age, and Golden Access Passports honored, show your pass at check-in and the entrance fee will be deducted from your transportation cost.
        If you arrive by private boat, fees are collected through a self service fee area on the main dock at Garden Key. Please note that the park does not have the ability to process credit cards at this fee station.
        Camping
        The campground is a self-service fee area with a nightly fee of $3 per person. A 50% discount applies to holders of the Golden Age or Golden Access Pass. No other discounts apply.
        Camping fees are collected only at the park, seaplane or ferry concessions do not collect camping fees. Please note that the park does not have the ability to process credit cards at this fee station.                </p>   
        </p>
    </div>
</div>

Answer 1

小提琴

javascript

首先你需要初始化手风琴，这将设置'div'部分的大小，然后初始化选项卡。信息选项卡将是一个不错的大小。

我还将您的 onclick 内容更改为选项卡提供的激活事件。我不确定#map initialize 调用应该去哪里，但是如果您只需要运行一次，您可以注册其他事件来启动初始化方法

$('#accordion').accordion( {heightStyle: "content"});
$(".tab-set").tabs({"activate":function(evt,ui){
    if(ui.newPanel){
        if( ui.newPanel.attr("id")=="Information"){
            ui.newPanel.find("#accordion").accordion("refresh");
        }else if(ui.newPanel.attr("id")=="Map"){
            //you'll need some check to make sure this hasn't fired already
            //if t/his is an ajax call, move this into a "load":function(evt,ui){} 
            //initialize();
        }
    } 
}});

html

我稍微改变了你的html。<p>我通过包装in清理了手风琴 html<div>

<div class="tab-set">  
<ul> 
    <li><a href="#States">States</a></li> 
    <li><a href="#Trending">Trending</a></li>
    <li><a href="#Map">Map</a></li>    
    <li><a href="#Cities">Cities</a></li>
    <li><a href="#NationalPark">National Parks</a></li>
    <li><a href="#StatePark">State Parks</a></li>
    <li><a href="#Information">Information</a></li>
</ul>
<!-- Hot Locations -->
<div id="Trending">
</div>
<!-- States -->
<div id="States">
</div>
<!-- Map -->
<div id="Map">    
</div>  
<!-- Cities -->      
<div id="Cities"> 
</div>
<!-- National Parks -->
<div id="NationalPark">
</div>
<div id="StatePark">
</div>
<div id="Information">
    <div id="accordion">
        <h3>Description</h3>
        <div><p>
        Almost 70 miles (113 km) west of Key West lies the remote Dry Tortugas National Park. The 100-square mile park is mostly open water with seven small islands.  Accessible only by boat or seaplane, the park is known the world over as the home of magnificent Fort Jefferson, picturesque blue waters, superlative coral reefs and marine life,  and the vast assortment of bird life that frequent the area.                
        </p></div>
        <h3>Operating Hours</h3>
        <div><p>
        Dry Tortugas National Park is open year-round
        The following limitations apply to specific areas within the park boundary:
        Garden Key is open year round 24 hours a day.
        Ft. Jefferson, on Garden Key, is open year-round from sunrise to sunset.
        Loggerhead Key is open to day visitors year round from sunrise to sunset. All other facilities on the island, including Loggerhead Lighthouse are closed to the public.
        Bush Key is open to visitors October 15th to January 15th from sunrise to sunset.
        Hospital Key, and Long Key are closed year round and visitors should remain 100 feet offshore of all closed islands.
        Middle and East Keys are open to visitors October 16 to March 31 from sunrise to sunset.                
        </p></div>
        <h3>Fees</h3>
        <div><p>
        Entrance Fee
        The entrance fee for the park is $5.00 for visitors 16 and older. This fee covers entrance to the park for 7 days.
        Entrance Fee Collection
        Currently, the Yankee Freedom Ferry and Key West Seaplane Adventures collect the park entrance fee from their passengers. If you are the proud owner of a National Parks Pass, Golden Eagle, Golden Age, and Golden Access Passports honored, show your pass at check-in and the entrance fee will be deducted from your transportation cost.
        If you arrive by private boat, fees are collected through a self service fee area on the main dock at Garden Key. Please note that the park does not have the ability to process credit cards at this fee station.
        Camping
        The campground is a self-service fee area with a nightly fee of $3 per person. A 50% discount applies to holders of the Golden Age or Golden Access Pass. No other discounts apply.
            Camping fees are collected only at the park, seaplane or ferry concessions do not collect camping fees. Please note that the park does not have the ability to process credit cards at this fee station.                </p></div>   
    </div>
</div>