如何用jQuery基于网站URL设置ASP.NET下拉列表选中值

没问题，这事儿用jQuery就能轻松搞定，我给你两种常见场景的实现方式，你根据自己的URL结构选就行：

场景1：URL带查询参数（比如?lang=Français） #

首先我们需要一个能从URL里提取参数的小函数，然后在页面加载时把对应语言设置为下拉列表的选中项：

// 用于从URL查询字符串中获取指定参数的函数
function getUrlParameter(paramName) {
    paramName = paramName.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + paramName + '=([^&#]*)');
    var paramValue = regex.exec(window.location.search);
    return paramValue === null ? '' : decodeURIComponent(paramValue[1].replace(/\+/g, ' '));
}

// 页面加载完成后执行
$(document).ready(function() {
    // 获取URL中的lang参数值
    var targetLang = getUrlParameter('lang');
    
    if (targetLang) {
        // 找到你的下拉列表（ASP.NET会生成客户端ID，所以用<%= LangSelect.ClientID %>获取真实ID）
        $('#<%= LangSelect.ClientID %>').val(targetLang);
    }
});

小提示： #

• 如果你的URL参数名不是lang，记得把函数里的参数名改成你实际用的（比如language）
• 如果你用的是ASP.NET 4.0及以上版本，可以给DropDownList设置ClientIDMode="Static"，这样客户端ID就是你定义的LangSelect，代码里直接写$('#LangSelect')就行
• 担心大小写不匹配？可以统一转成小写来匹配：

var targetLang = getUrlParameter('lang').toLowerCase();
$('#<%= LangSelect.ClientID %> option').filter(function() {
    return $(this).val().toLowerCase() === targetLang;
}).prop('selected', true);

场景2：URL是路径形式（比如www.yoursite.com/fr/home） #

如果语言是URL路径的一部分，我们可以解析路径来获取语言标识，再映射到下拉列表的Value值：

$(document).ready(function() {
    // 拆分URL路径，获取第一个路径段（比如fr）
    var pathSegments = window.location.pathname.split('/');
    var langCode = pathSegments[1]; // 这里假设语言代码在路径的第一个位置
    
    // 建立语言代码和下拉列表Value的映射关系
    var langMapping = {
        'en': 'English',
        'fr': 'Français',
        'es': 'Español'
        // 可以继续添加其他语言的映射
    };
    
    // 如果映射关系里有对应的语言，就设置选中
    if (langMapping[langCode]) {
        $('#<%= LangSelect.ClientID %>').val(langMapping[langCode]);
    }
});

这样不管是参数形式还是路径形式的URL，都能准确把下拉列表设置到对应的语言选项啦。

内容的提问来源于stack exchange，提问作者Ross