jQuery Mobile：ページ変更後にナビゲーションが開かない

Question

私のjQuery Mobileプロジェクトでは、トグルアイコン付きの#sidebarという要素があります。私のベースファイルで

、私は次のコードを使用#sidebar divの下：完全に罰金作品を切り替え、初めて

<a href="javascript:void(0)" id="toggle-sidebar">Toggle sidebar</a> 
<div id="sidebar"> ... </div> 

$('#toggle-sidebar').on('click', function() { 
    $('#sidebar').toggleClass('visible'); 
}); 

私のページが読み込まれます。しかし、メインナビゲーションでページを変更すると、トグルがもう機能しなくなります。私は、クリック機能の中に警告を入れ、そのページが変更された後、その警告が複数回、すなわち以前にページを変更した回数だけ実行されることに気が付いた。

ブラウザにURLを入力してページを読み込んで、別のページに移動すると、トグルが再び機能します。

どうすればこの問題を解決できますか？

Answer 1

ページを変更した後に警告がクリックで何度も実行される場合、ページの変更ごとに新しいクリックイベントリスナーがバインドされていることが示唆される場合があります。このような状況を避けるために、クリックリスナーをバインドする前に、その要素のクリックイベントリスナーのバインドを解除してください。そのようなSth：

$('#toggle-sidebar').off('click'); 
$('#toggle-sidebar').on('click', function() { 
    $('#sidebar').toggleClass('visible'); 
}); 

これで問題が解決する場合があります。

また、jQueryイベントの名前空間https://api.jquery.com/event.namespace/もご覧ください。また、クリックイベントに名前空間を追加して、いつかコードに表示される可能性のあるその要素の他のクリックイベントをアンバインドしません。