使用JQuery導航到帶有選擇的下拉菜單上的頁面

Question

我正在嘗試導航到語言選擇的頁面。這是我從模板中獲得的HTML代碼。

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

如何在用戶選擇語言時導航到頁面？我必須用JQuery來完成。

Answer 1

那麼...這是一個非常簡單的例子，只是重定向到onchange事件的頁面。

它重定向到的頁面只是目標文件的下拉列表和文件擴展名的值。

$('.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 
    }); 

更多涉及協議specifik目標：

$('.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

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

Answer 3

下面的代碼將幫助您

jquery: 

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

Answer 4

如果你想重定向到www.mypage.com/en

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

Answer 5

你可以做像以下：

HTML：

​​

和jQuery：

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