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
5026
jQuery

【日本語対応】Datepickerを使って予約フォームにカレンダー式日付選択を入れる方法【jQuery】

更新日:2022.09.09
2928
jQuery

【簡単】スマホでよくある横スライドメニューを実装する方法【jQuery・CSS使用】

更新日:2022.09.09
5349
jQuery

iframeで埋め込みしたユーチューブをiframe外で停止させる方法。

更新日:2022.09.09
6512