Jquery移動事件 - 需要面板和協作集的幫助

我有以下代碼，我試圖找出如何在面板關閉時使用事件來關閉面板中的可摺疊集。我在jfFiddle中包含了一個示例，鏈接如下，鏈接http://jsfiddle.net/rLjBB/4/以及下面的代碼。我需要一些幫助來理解如何使用jQuery Mobile框架來處理事件的使用。當談到這個圖書館時，我是一個開始，所以任何援助將不勝感激。Jquery移動事件 - 需要面板和協作集的幫助

<body> 

<div data-role="page" id="MuseMain"> 

    <div data-role="panel" id="leftmenupanel"> 

     <div data-role="collapsible-set" data-collapsed="true"> 
      <div data-role="collapsible" data-theme="b" data-content-theme="d" > 
       <h3>Overview</h3> 
       <p>The overview provides what is normally seen on a book cover; the name, author and description of the story.</p> 
       <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">Edit</a> 
      </div> 
     <div data-role="collapsible" data-theme="b" data-content-theme="d" > 
      <h3>Chapters & Scenes</h3> 
      <p>The chapters are where the details of the chapters are defined and the actual storyline scenes are created..</p> 
      <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">Edit</a> 
     </div> 
     <div data-role="collapsible" data-theme="b" data-content-theme="d" > 
      <h3>Characters</h3> 
      <p>The characters area is very detailed and allows the attributes to be defined, a detailed description, personality type, and relationships.</p> 
      <a href="" data-role="button" data-mini="true" data-icon="edit" data-inline="true" data-theme="a">Edit</a> 
     </div> 


    </div> 

</div><!-- /panel --> 

<div data-role="header"> 

    <a href="#leftmenupanel" id="changeIconValue" data-role="button" data-icon="bars" data-theme="b" data-inline="true">Menu</a> 

    <h1>Muse - A Writer's Assistant</h1> 

</div> 

<div data-role="content"> 

    <h2>Page content</h2> 
    <p>Page content goes here.</p> 

</div> 
<div data-role="footer"> 
    <h1>Design By IntelligentDesigns</h1> 
</div>

</body>

來源

2013-05-19 user2399539

這可以解決你的問題：

$('#leftmenupanel').panel({ 
    close: function(event, ui) { 
     $('#leftmenupanel div[data-role="collapsible"]').trigger('collapse'); 
    } 
});

我把它添加到一個更新的小提琴：http://jsfiddle.net/rLjBB/5/

來源

2013-05-19 19:16:27 Joe

太好了！這樣做的工作，並提供了一些關於如何在我需要他們的其他領域在這個框架中處理這些事件的一些理解。 – user2399539

以下是供參考的api文檔：http://api.jquerymobile.com – Joe

Jquery移動事件 - 需要面板和協作集的幫助

回答

相關問題