jQueryのloadメソッドでファイル(ページ)を呼び出す
2022/01/27
サイト内でヘッダーやフッター等共通のパーツはそれぞれ別ファイルに分けてPHPのinclude関数で呼び出すことが多い。ただPHPが利用不可の案件があり、どうしようかと調べたところjQueryのloadメソッドを使うことで呼び出しできるとのこと。以下に方法をメモ。
リファレンス
http://semooh.jp/jquery/api/ajax/load/+url%2C+data%2C+callback+/
ソースコード
<script type="text/javascript" src="//code.jquery.com/jquery-3.5.1.js"></script> <script> $(function(){ $('#result').load('https://hoge.com/hoge.php', function(data, status){ if( status !== 'success' ){ console.log('error'); } }); }); </script>
呼び出す際はGETパラメータの付与も可能。
クロスドメインの場合
異なるドメインのページを呼び出す場合、CORSの問題で呼び出せないことがある。そのような場合は呼び出される側のサーバに以下を記述したhtaccessファイルを設置すること。
Header append Access-Control-Allow-Origin: *
所感
ごく稀にPHPが使えない環境で何らかの機能を搭載して欲しいみたいな案件があるがjQueryのloadメソッドを使うことで色々回避することができそう。
関連記事
-
formで複数選択可能なセレクトメニュー(プルダウン)を実装する方法(select2)
フォームで複数選択可能なセレクトボックス(プルダウン)を実装したい。ただHTML ...
-
jquery.cookie.jsで保存期間を時間指定する方法
jquery.cookie.jsで保存期間を1時間等、時間指定したい。公式サイト ...
-
jQueryで指定の行動をとった際に、クリックイベントを発火させる方法
あるシステムでAという要素をクリックした際に何らかの処理を行うという部分があり、 ...
-
要素の点滅
やりたかった事はaタグ内で囲まれている部分を点滅。 <blink>だ ...
-
リアルタイムプレビュー時の改行とテーブルの上部揃え
■サンプル http://sample.taitan916.info/previ ...