javascript - jQuery Mobile Widget の寿命は?

Question

ウィジェットの有効期間に関連していると思われる jQuery Mobile 1.3.1 テーブル ウィジェットに問題があります。

ページで columntoggle モードでテーブル ウィジェットを使用しています。ページを初めて使用するときは、問題はありません。その後、(ブラウザー ウィンドウを更新せずに) サイト内を移動してからページに戻ると、ウィジェットの 2 つのインスタンスがぶら下がっているように見えます。古いものは、ページのサイズを変更しようとするとエラーが発生します。これは、アンロードされた要素を操作しようとしているためだと思います。

コード例は以下にあり、このフィドルで公開されています: http://jsfiddle.net/cjindustries/thqga/ (ページ 2 に移動し、ブラウザーのサイズを変更します。要素の削除は、ページをアンロードする JQM をエミュレートします)。

jQuery Mobile が一般的にウィジェットを管理する方法と、このシナリオでウィジェットを積極的に破棄する必要があるかどうか、またはどのように破棄する必要があるかを誰かに説明してもらえますか?

ありがとう、クリス。

<div id="p1" data-role="page">
<table data-role="table" id="table1" data-mode="columntoggle" class="ui-responsive table-stroke">
     <thead>
       <tr>
         <th data-priority="2">Rank</th>
         <th>Movie Title</th>
         <th data-priority="3">Year</th>
         <th data-priority="1"><abbr title="Rotten Tomato Rating">Rating</abbr></th>
         <th data-priority="5">Reviews</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <th>1</th>
         <td><a href="http://en.wikipedia.org/wiki/Citizen_Kane" data-rel="external">Citizen Kane</a></td>
         <td>1941</td>
         <td>100%</td>
         <td>74</td>
       </tr>
       <tr>
     </tbody>
   </table>
    <a href="#p2" data-role="button">Page 2</a>
</div>
<div id="p2" data-role="page">
<table data-role="table" id="table2" data-mode="columntoggle" class="ui-responsive table-stroke">
     <thead>
       <tr>
         <th data-priority="2">Rank</th>
         <th>Movie Title</th>
         <th data-priority="3">Year</th>
         <th data-priority="1"><abbr title="Rotten Tomato Rating">Rating</abbr></th>
         <th data-priority="5">Reviews</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <th>7</th>
         <td><a href="http://en.wikipedia.org/wiki/The_Graduate" data-rel="external">The Graduate</a></td>
         <td>1967</td>
         <td>91%</td>
         <td>122</td>
       </tr>

     </tbody>
   </table>
    <a href="#p1" data-role="button">Page 1</a>
</div>

$(document).on('pageshow', '#p2', function () {
    $('#p1').html('');
});