Written by Kasumi

jqueryを使って、パラメーターを追加・付与し、条件分岐する方法

こんにちは、カスミです。

さて、以下のような疑問をお持ちでしょうか?

jqueryを使って、URLにパラメータ―を付与したい。

また、付与されてるURLと付与されてないURLで条件分岐して、テストページとして見せたい。

本記事では、このような疑問を解決致します。

※jqueryを使うため、事前にライブラリを読み込みましょう。

パラメータ―を付与し、条件分岐させるコード

$(function () {
  var url = location.href;
  params = url.split("?");
  spparams = params[1].split("&");
  var paramArray = [];
  for (i = 0; i < spparams.length; i++) {
    vol = spparams[i].split("=");
    paramArray.push(vol[0]);
    paramArray[vol[0]] = vol[1];
  }
  if (paramArray["key"] == "test") {
    // パラメータ―付きの場合の処理
  } else {
    // パラメータ―無しの場合の処理
  }
});

上記がサンプルコードになります。

詳細は以下の通りです。

サンプルコードを実装すると、URLに以下のようなパラメータが付与されます。

https://ドメイン名/?key=

サンプルコードの下部あたりにある条件分岐にて、?keyにtestが入った場合(https://ドメイン名/?key=test)の処理と入ってない場合の処理を書いてif elseで書いて上げればOKです。

以上で解説を終わります。

まとめ

本記事ではjqueryを使った方法を紹介しておりますが、PHPでパラメータを付与する方法についても下記記事で扱っているので参照してみてください。

以上で解説を終わります。

目次

関連記事

jQuery

【jQuery】ページ内スクロールで一部だけスクロールさせたくない。除外方法を解説

更新日:2022.09.09
1729
jQuery

スムーズスクロール機能をjavascript(jquery)を使用し実装する方法

更新日:2022.09.09
3255
jQuery

jqueryを使って要素を移動・追加・親要素を作成する方法【簡単テンプレ公開】

更新日:2022.09.09
5075
jQuery

jQueryで画像読み込み完了後にイベントを実行する方法

更新日:2022.09.09
6894