jQuery MobileでAjaxによる画面遷移中を判定する方法

JavaScript

2012.09.05

jQuery Mobileの強力な(？)Ajax画面遷移ですが、リンクの読み込み途中に他のリンクをクリックできるので、リンクを連打したりするとちょっと気持ち悪い挙動を起こします。
具体的には、複数のページの読み込み処理が並列で走り、読み込み終わったものが順次表示されていくので、画面がガチャガチャと切り替わります。

画面遷移中を判定する

jQuery MobileのAjaxによる画面遷移中は<html>タグにclassが貼られるので、それを見れば判定できそうです。

if ($('html').is('.ui-loading')) {
    // 読込中の場合の処理
}

たとえば、フォームの送信途中に、もう一度送信ボタンが押されたことなどを、簡易に判定することができます。