web-dev-qa-db-ja.com

ページを読み込む前にjQuery MobileでAjaxを無効にする方法

私のモバイルWebサイト。 AdSenseモバイル広告をロードしようとしましたが、ページがロードされた後も引き続きページ全体を占有します。

Ajaxを無効にすると、ページが広告とともに正常に読み込まれることがわかりました。これは、タグのあるリンクをクリックするため、ロードする2番目のページでのみ機能します...

data-ajax="false"

これにより、次のページが完全にロードされます。

問題：Ajaxが有効になっているため、最初に読み込まれたページがAdSense広告によって上書きされます（と思います）。

基本的に私のページの最初の部分はこのように見えます...

<html>
<head>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc3/jquery.mobile-1.0rc3.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0rc3/jquery.mobile-1.0rc3.min.js"></script>
<script language="text/javascript">

      $(document).bind("mobileinit", function () {

            $.mobile.ajaxEnabled = false;

      });

</script>
</head>
<body>

    <div data-role="header">
        <h1>Angry Birds Cheats</h1>
    </div>



    <div data-role="content">

<div>
    <script type="text/javascript"><!--
  // XHTML should not attempt to parse these strings, declare them CDATA.
  /* <![CDATA[ */
  window.googleAfmcRequest = {
    client: '',
    format: '',
    output: '',
    slotname: '',
  };
  /* ]]> */
//--></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_afmc_ads.js"></script>
</div>

コードでajaxを無効にしようとしましたが、広告がまだページ全体を占有しているためだとは思いません...

特定のページで訪問者を開始し、それらをajax以外のページにリダイレクトできると考えていました。

javascriptjqueryhtmlajaxjquery-mobile
29
Joe

mobileinitイベントへのバインドに関するドキュメントをチェックアウトします。 http://jquerymobile.com/demos/1.0/docs/api/globalconfig.html

具体的にはこのビット：

Mobileinitイベントは実行直後にトリガーされるため、jQuery Mobileがロードされる前にイベントハンドラーをバインドする必要があります。

mobileinitイベントにバインドするための適切な形式は次のとおりです。

_<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc3/jquery.mobile-1.0rc3.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function () {
    $.mobile.ajaxEnabled = false;
});
</script>
<script src="http://code.jquery.com/mobile/1.0rc3/jquery.mobile-1.0rc3.min.js"></script>
_

最初にjQueryコア（したがって.bind()が使用可能）、次にmobileinitイベントハンドラー、jQuery Mobile jsファイル（これは最後ですので、mobileinitのイベントハンドラーイベントが発生する前に設定されます）。

関数にmobileinitを挿入することで、現在のalertイベントハンドラーが起動していないことをテストできます。

60
Jasper

更新されたjQuery Mobileのドキュメントは次のとおりです。 http://jquerymobile.com/test/docs/api/globalconfig.html

JQueryやjQuery UIなどの他のjQueryプロジェクトとは異なり、jQuery Mobileは（document.readyイベントが発生するずっと前に）ロードするとすぐに多くのマークアップ拡張機能を自動的に適用します。これらの機能強化は、一般的なシナリオで動作するように設計されたjQuery Mobileのデフォルト設定に基づいて適用されます。設定の変更が必要な場合、設定は簡単です。

mobileinitイベント

JQuery Mobileが起動すると、ドキュメントオブジェクトでmobileinitイベントがトリガーされます。デフォルト設定を上書きするには、mobileinitにバインドします。

$(document).on("mobileinit", function(){
  //apply overrides here
});

Mobileinitイベントはすぐにトリガーされるため、jQuery Mobileがロードされる前にイベントハンドラーをバインドする必要があります。次の順序でJavaScriptファイルにリンクします。

<script src="jquery.js"></script>
<script src="custom-scripting.js"></script>
<script src="jquery-mobile.js"></script>

JQueryの$ .extendメソッドを使用して$ .mobileオブジェクトを拡張することにより、デフォルト設定をオーバーライドできます。

$(document).on("mobileinit", function(){
  $.extend(  $.mobile , {
    foo: bar
  });
});

または、オブジェクトプロパティ表記法を使用して設定できます。

$(document).on("mobileinit", function(){
  $.mobile.foo = bar;
});
5
bluescrubbie

JqueryモバイルAjaxの動作を理解するのに役立つページ

http://jquerymobile.com/test/docs/pages/page-links.html

アニメーション化されたページ遷移を有効にするには、外部ページ（例：products.html）を指すすべてのリンクがAjaxを介してロードされます。

他のドメインを指すリンク、またはrel = "external"、data-ajax = "false"またはターゲット属性を持つリンクは、Ajaxでロードされません。代わりに、これらのリンクにより、アニメーション化されたトランジションなしでページ全体が更新されます。両方の属性（rel = "external"およびdata-ajax = "false"）の効果は同じですが、別のサイトまたはドメインにリンクする場合はrel = "external"を使用し、data-ajax = " false」は、ドメイン内のページをAjax経由でロードすることを単に選択するのに役立ちます。

1
user1283182

ページごとのソリューションを無効にすると、Anchorタグでdata-ajax = "false"が有効になります

0
user1293466