リンクをクリックした時にurlのディレクトリを追加する

Question

現在言語切り替えボタンを作成しようと考えており、日本語用と英語用のサイトをwordpressにてそれぞれ作成して英語にはurlの末尾のenをつけて作成しました。
aタグをクリックした際に現在のページのurlにenを追加してサイトの表示を切り替える方法がわからずにいます。

https://test.jp/〜からhttps://test.jp/en/〜のように表示しているページを切り替えずにurlにenを追加して表示し直す方法はありますでしょうか

クリックイベントでどうにかできないかと思ったのですがやり方がわからず、以下の内容の参考コードを試したところブログなどの投稿ページがうまく切り替えられませんでした。

<div>
  <a id="ne-link" href="#">English</a>
</div>

<script type="text/javascript">
		jQuery(function($){
window.onload = function () {
　　var json = [
	  //en
	  { "current":"http://example.com/",
　　　　 "link" :"http://example.com/"}
　　]
　　for( var i in json ){
　　　　if( json[i].current == window.location.href ){
　　　　　　var element = document.getElementById( "ne-link" ) ;
　　　　　　element.href = json[i].link;
　　　　　　break;
　　　　}
　　}
}
 });
</script>

Comments

[m.ts10806]

実在するサイトurlを使うと迷惑をかけることになるので、自身のサイトでないのでしたら例示ドメインを利用してください

[m.ts10806]

わざわざJavaScriptでしなくてもそういうリンクurlにすれば良いのでは？

[masaru_666]

切り替えた際に同じページを開いたまま切り替えできるようにしたく考えています。

[m.ts10806]

httpを切ればいいわけではありません。例示ドメインを使ってください。
https://ja.m.wikipedia.org/wiki/Example.com

>切り替えた際に同じページを開いたまま切り替えできるようにしたく考えています。

切り替える＝画面のリロードが必要
なのでは。通常のリンクではできない理由も質問本文に明記してください

Answer 1

<a class=en href=https://example.com>sample (EN)</a><br>
<a class=en href=https://example.com>sample (JA)</a>

$('a').click(function() {
  event.preventDefault();
  var className = $(this).attr('class');
  var lang = {en:'https://example.com/en/',ja:'https://example.com/ja/'};
  window.location.href = lang[className];
});

サンプル

---

IDだったら

<a id=en href=https://example.com>sample (EN)</a><br>
<a id=en href=https://example.com>sample (JA)</a>

$('a').click(function() {
  event.preventDefault();
  var idName = $(this).attr('id');
  var lang = {en:'https://example.com/en/',ja:'https://example.com/ja/'};
  window.location.href = lang[idName];
});

Comments

[kyoya0819]

普通にリンクに書けばいいと思うけどこんな感じかな？