2012-02-07 7 views
2

私のページの画像にクリックイベントを添付しています。イベントの複製からJQuery Mobileを停止する方法はありますか?

$('.ui-block-b img').click(function(event) {} 

私はjQueryモバイル固定フッターを使用しています。

私はpagecreatepageinitの両方のイベントを使用してこれを初期化しようとしました。

フッタのリンク(Ajaxでロードされている)をクリックしてクリックハンドラでページに戻ると、pagecreatepageinitがリファインされています。これは別のクリックイベントを添付しているので、画像をクリックすると2つのイベントが発生します。

私はjqueryモバイルイベントがこれに対処しているのでしょうか?私はドキュメンテーションで何かを逃したのですか?

私は、この問題を取り付ける前にイベントが存在するかどうかをチェックすることで対処しましたが、jQueryモバイルでこれを処理する必要があるようですか?私はこれを完了しました

var events = $('.ui-block-b img').data('events'); 
if (typeof events == 'undefined') { // attach handler} 

多分、jQueryモバイルは既にこの問題に対処していますが、私は何か不足していますか?

答えて

3

ページが作成されるたびに、そして別のクリックイベントがバインドされるたびにJSが実行されているという問題があることを知っているので、新しいページをJSに読み込まないでください。

解決策は、pageshowイベントの発生後に利用可能なネイティブjQMポインタ$ .mobile.activePageを使用して要素を参照することです。または、jQuery onリスナーをpageinitイベントのルートページdiv(ドキュメントではない)に配置します。

$('.ui-block-b img').click(function(event) {}を使用すると、複数のページの要素にバインドイベントを付加する可能性があります(jQueryはページをDOMに追加するため)。

<script type="text/javascript">   
    $("div:jqmData(role='page'):last").bind('pageinit', function(){ 
     //your code here - $.mobile.activePage not declared, but you can setup 
     // "on" events here that handle elements ONLY on this page 
     //e.g. $(this).on('click', 'img.ui-block-b', function(){}); 
     // this puts a live event listener that only listens for this page 
    }); 

    $("div:jqmData(role='page'):last").bind('pageshow', function(){ 
     //your code here - $.mobile.activePage works now 
    }); 
</script> 

イベントをバインドすると、現在のページの要素にのみ影響します。 Jquerymobile - $.mobile.changepage

:私は、私はここに別の質問に与えたより良いソリューションを、痛みのビット概説しているされ、これを整理


関連する問題