使用JQuery导航到下拉菜单上具有选择的页面

Question

I am trying to navigate to a page on language selection. Here is my HTML code which I got from a template.

<div class="change-language">
     <select class="select-language selectpicker">
          <option value="en">Türkçe</option>
          <option value="ge">English</option>
     </select>
</div>

How can I navigate to a page when a user selects a language? I have to do it with JQuery.

Answer 1

Well... here's a really simple example simply redirecting to page on an onchange event.

The page that it redirects to is simply the value of the dropdown and the file extension of the target file.

$('.select-language').on('change',function(){
    var value = $(this).val();
    location.href = value +'.html'; //or .php, etc. This will go to a page called en.html
    });

More specifik target involving the protocol:

$('.select-language').on('change',function(){
    var value = $(this).val();
    location.href = 'http://your-url.com/'+ value +'.html'; //or .php, etc. This will go to a page called en.html
    });

Answer 2

You can do smth like the following:

HTML:

<div class="change-language">
     <select class="select-language selectpicker">
          <option value="page-tu.html">Türkçe</option>
          <option value="page-en.html">English</option>
     </select>
</div>

And JQuery:

$('.select-language').on('change', function(){
    location.href = $(this).val();
});

Answer 3

$(".select-language").on("change", function() {
   //Will redirect to en.url.com, ge.url.com, etc...
   window.location.href = "http://" + this.value + ".url.com";          
});

Answer 4

Below code will help you

  jquery:

   $(document).ready(function(){    
    $(".select-language").change(function(){      
     var page_url = "http://"+$(".select-language").val()+".com";    
     $(location).attr('href',page_url);
    });
   });

Answer 5

If you want to redirect to www.mypage.com/en

$(".select-language.selectpicker").on("change", function(){
    window.location.href = this.value;
});