使用jQuery添加到页面URL

时间:2017-11-05 02:00:07

标签: javascript jquery html



$('.toggles span').click(function() {
  $(".toggles span").removeClass("active");
  $(this).addClass("active");
});


$('.spanish').click(function() {
  $(location).attr('href') + '/es');)
};
$('.english').click(function() {
      if (window.location.href.indexOf("/es") > -1) {
        location.href = location.href.replace("/es", "");
      )
    };

.spanish {
  cursor: pointer;
}

.toggles span:active {
  text-decoration: underline;
}

.spanish:hover {
  cursor: pointer;
  text-decoration: underline;
}

.english:hover {
  cursor: pointer;
  text-decoration: underline;
}

.spanish:active {
  text-decoration: underline;
}

.active {
  text-decoration: underline;
}

.english {
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <p class="toggles">
    <span class="spanish">spanish</span> | <span class="english">english</span>
  </p>
</div>
&#13;
&#13;
&#13;

我正在尝试创建一个基本上在重复的西班牙语和英语页面之间切换页面的函数。所以我需要找到一种方法来获取当前的网址,然后添加&#34; es&#34;或&#34; en&#34;最后,将用户带到页面的西班牙语或英语版本。

因此,如果用户访问英文页面"example.com/page-1/"并点击顶部的西班牙语切换,那么他们的网址将为"example.com/page-1/es"

$(document).ready(function() {
    $('.spanish').click(function () {
        $(location).attr('href') + '/es');
  )};
    $('.english').click(function () {
      if(window.location.href.indexOf("/es") > -1) {
       location.href=location.href.replace("/es", "");
  )};
)};

非常感谢任何帮助,感谢您的时间!

&lt; -----------------------以下更新的解决方案!------------------ -----&GT;

以下建议是在单击按钮时使用显示/隐藏功能。这是通过使用class =&#34; englishText&#34;创建两个div来完成的。另一个类=&#34; spanishText&#34;并使用以下内容。

      $(".spanish").on("click", function() {
    $(".englishText").hide();
    $(".spanishText").show();
  });

  $(".english").on("click", function() {
    $(".englishText").show();
    $(".spanishText").hide();
  });

编辑 - 使用show / hide功能我创建了上面的代码并且它可以工作。谢谢你的建议!

1 个答案:

答案 0 :(得分:0)

而不是更改位置,更好的方法(在我看来)将加载&lt; iframe&gt;中的两个页面。 s并使用按钮切换其可见性