東京ウェブ制作ブロマガ

jQueryのページ遷移にてGETでパラメータを渡す方法

2013/03/07 17:39 投稿

  • タグ:
  • 登録タグはありません
  • タグ:
  • 登録タグはありません
まず index.php を作成し、下記のように記載しておく。

<?php

// isset判定を入れないと「Notice: Undefined index」と表示されるので注意。
$photo_size = ''; if(isset($_GET["photo_size"])){ $photo_size = $_GET["photo_size"]; }
$photo_id = ''; if(isset($_GET["photo_id"])){ $photo_id = $_GET["photo_id"]; }

// ヒアドキュメント
$htdocs=<<<EOD
<!DOCTYPE html> 
<html lang="ja"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>

<div data-role="page" id="index">
<p>GETで取得した値</p>
$photo_size
$photo_id
<hr>
<p>このページは index です。</p>
<p>このファイルのファイル名は index.php です。</p>
<p><a href="#tokyo">東京</a></p>
<p><a href="#kanagawa">神奈川</a></p>
<hr>
<p><a href="./index.php?photo_size=kakudai&photo_id=1">トップページ(index)にGETでパラメータを渡す</a></p>
</div>

<div data-role="page" id="tokyo">
<p>東京</p>
</div>

<div data-role="page" id="kanagawa">
<p>神奈川</p>
</div>

</body>
</html>

EOD;
echo $htdocs;

?>

この状態で、index.php にhttpアクセスする。
最初の画面にはGETパラメータの取得値は表示されない。
この状態で「東京」や「神奈川」をクリックすると、通常のjQueryとしてページが遷移するだけで
GETパラメータの引渡しは無い。
しかし
トップページ(index)にGETでパラメータを渡す
をクリックすると、index.php に対して、GETパラメータ
photo_size=kakudai
photo_id=1
が渡される。
そして、GETで取得した値として、
kakudai 1
がブラウザに表示される。

サンプルソース
https://tokyo-webs.jp/sample_source/130307a/

東京ウェブ制作

ブロマガ会員ならもっと楽しめる!

  • 会員限定の新着記事が読み放題!※1
  • 動画や生放送などの追加コンテンツが見放題!※2
    • ※1、入会月以降の記事が対象になります。
    • ※2、チャンネルによって、見放題になるコンテンツは異なります。
東京ウェブ制作ブロマガ

東京ウェブ制作ブロマガ

大和賢一郎

月額:¥550 (税込)

コメント

コメントはまだありません
コメントを書き込むにはログインしてください。

いまブロマガで人気の記事

継続入会すると1ヶ月分が無料です。 条件を読む

東京ウェブ制作チャンネル

東京ウェブ制作チャンネル

月額
¥550  (税込)
このチャンネルの詳細