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アプリ開発 -Bundle identifierを変えてはまった-

* 現象 Bundle identifierを変えた際にXcodeで実機に転送しようとすると以下のエ

記事を読む

iPad(Retinaディスプレイモデル)にiOS7を入れてみた

iPadにiOS7を入れてみたので、その報告。 iPhone5にはまだ入れておかないでおこうと思っ

記事を読む

no image

PhoneGapを触ってみた ―導入編―

スマートフォン対応をjQuery Mobileを使ってやったので、その資産をいかせないかということで

記事を読む

no image

Twitterでサービスにログイン -PHP(CakePHP1.3)で実践編-

以前、ソーシャルログインについて書きました。 ただ、Twitter連携にまだ触れてない人にはちょ

記事を読む

no image

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

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

記事を読む

no image

iPhoneアプリ開発 -UIButtonのTouch Down、Touch up Inside、Touch up Outsideの使い方-

* Touch DownとTouch up Inside、Touch up Outsideの違い

記事を読む

jenkins-files

Windows環境でもJenkins -執事さんとご対面-

Trac Lightningに同梱されていますし、Windows環境でHudsonを使っている人は結

記事を読む

no image

Facebookがちょっとコワイ vol.2 -本当にあなたはあなたなの?-

以下のブログを読んで、さらにコワイと思ったFacebook。 あなたが登録している「友

記事を読む

Jenkins + DeployGate(2) -DeployGateにアプリをアップ!-

DeployGateを使ってますか? 継続的にDeployってますか? TestFlightの

記事を読む

no image

Twitterでサービスにログイン -ソーシャルログイン-

* やりたいこと -自身のWebサービスにTwitterIDでログイン(ソーシャルログイン)したい。

記事を読む

広告

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にするといいかもしれないです。

Message

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

次の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 ↑