jQuery Mobileの初期設定 -jQuery Mobieを利用時にページ内リンクさせたい-

公開日: : IT, jQueryMobile


 前提

jQuery Mobileを利用していて、以下のタグを使ってページ内遷移したいことがありました。
しかし、jQuery Mobileを利用しているときは、以下のタグを使ってページ内遷移はできません。

<a href="#sample">飛ぶ</a>
//略
<a name="sample">サンプル</a>

 

jQuery Mobileを利用している場合、以下のように1ページ内にタグを使って飛ばすことは出来ます。
しかし、これはあくまでも別ページが表示される形でありページ内遷移ではありません。
※複数ページテンプレート

<div data-role="page">
<a href="#sample">飛ぶ</a>
</div>
<div data-role="page" id="sample">
サンプル
</div>

 解決策

「複数ページテンプレート」を使わない場合のみ、以下の設定をすることで対応することが出来ます。

   $.mobile.hashListeningEnabled = false;

 

以下のような形で、初期設定として読みこませればOKです。

$(document).bind("mobileinit", function(){
   $.mobile.hashListeningEnabled = false;
});

※この設定をfalseにしてしまうと「複数ページテンプレート」ができなくなってしまう点に注意です。

 参考

グローバル設定 | jQuery Mobile 1.1.0 日本語リファレンス

広告

関連記事

no image

iPhoneアプリ開発 −iOS6からの「写真」へのアクセス問題−

写真を扱うアプリを開発している際に問題になったこと。 ※結構前の話を今更まとめてみる。 * 写真へ

記事を読む

dl-1

CakePHP2系にTwigを導入

CakePHP2系でも慣れているSmartyを使おうと思ったものの、良いプラグインが見つからず断念。

記事を読む

no image

CakePHP1.3にSmartyを導入

いい加減、CakePHP(1.3)にもSmartyを導入することにしました。 * ダウンロード

記事を読む

構成

定期的にデータ取得のためにCakePHP1.3でシェル機能を利用

定期的にデータを取得する行為をするために、はじめてシェル機能を使ってみたのでメモ。 * ス

記事を読む

no image

ターミナルでgitのコマンドを補完したりブランチ名を表示する – macでgitを便利に使うために –

* やりたいこと macのターミナルでgitをいじっていると -今のブランチってなんだっけ? -g

記事を読む

no image

研究室での進捗報告の方法について、ふと思ったこと

* 以下に加筆・修正して移動しました。

記事を読む

no image

さくらのVPSでJenkins -執事さんとご対面-

さくらのVPSを利用している方は多いかと思います。 私も、自分で遊ぶ用(開発用)として借りてみまし

記事を読む

no image

iPhoneアプリ開発 -mixiSDKを使ってmixi連携をしてみる(2)-

* 前回 は、「ユーザーにAPI利用のための認可」をおこなってもらうところまでやりました。 本エン

記事を読む

iPhoneアプリ開発 芳名帳アプリ作成(4) -設定準備-

* 今までの流れ - -[http://pplace.jp/2013/06/1531/:title=

記事を読む

no image

iPhoneアプリ開発 −遷移先のViewControllerに値を引き継ぎたい−

例えば、トップページに複数個のボタンがあって、「A」と「B」というボタンを押下した際に、同じView

記事を読む

広告

Comment

  1. こじま より:

    上記スクリプトを設置したのですが、やはりページ内リンクができない状態です。
    スクリプトの設置場所はhtml上なのが問題なのでしょうか?

  2. とし より:

    どのように書いたかわかりませんが、htmlファイルに以下のように書いてもダメでしたか?

    &lt;script type=&quot;text/javascript&quot;&gt;
    $(document).bind(&quot;mobileinit&quot;, function(){
       $.mobile.hashListeningEnabled = false;
    });
    &lt;/script&gt;
    
  3. koo より:

    こじまさんと同じ状況におかれているものです。
    としさんのアドバイスどおりhtmlファイルに上記のものを記述させていただきましたが、一向にリンクが出来ない問題が解決できませんん。(内部リンクのみとばない。)
    無知で申し訳ないのですが、他に何か解決策はありませんでしょうか?

  4. とし より:

    気がつくのが遅くなって申し訳ないです。
    他に、linkBindingEnabledをfalseにするといいかもしれないです。

とし へ返信する コメントをキャンセル

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

広告

no image
[感想] Effective Objective-C 2.0 ☆☆☆☆★(4.5)

* 構成 - 第1章 Objective-Cに慣れる -

no image
[感想] iOSアプリテスト自動化入門 ☆☆☆(3.0)

* 構成 - Chapter 1 テスト自動化への取り組み

DeployGateを試してみた(iOS編) -DeployGateがiOSに対応-

今までのDeployGate - -[http://pplace.

iPhone/iPadアプリを開発するためにやったこと

今までに、iPhoneを3本ほどリリース((リリースしたアプリは全て1

no image
ターミナルでgitのコマンドを補完したりブランチ名を表示する – macでgitを便利に使うために –

* やりたいこと macのターミナルでgitをいじっていると -今の

→もっと見る

PAGE TOP ↑