Question

我有一个使用Umbraco（MVC .NET）的Web应用程序（目前）只有两个根。他们被命名为＆＃34;英语＆＃34;和＆＃34;瑞典＆＃34;。英语是默认网页，瑞典语应该是用户可选的。为了让用户能够更改语言，我使用Razor在下拉菜单中显示它们：

@{
   List<SelectListItem> languages= new List<SelectListItem>();
   foreach (var language in Model.Content.Siblings())
   {
      languages.Add(new SelectListItem
      {
         Text = language.Name,
         Value = language.Url
    });
}
@Html.DropDownList("LanguageSelect",new SelectList(languages,"Value","Text"), htmlAttributes: new { id = "LanguageSelect" });
}

这可以在根级别正确输出根的名称。现在使用javascript我使用onchange重新路由：

document.getElementById("LanguageSelect").onchange = function() {
    window.location.href = this.value;      
};

这适用于从一种语言转到另一种语言。现在困难的部分开始了：因为这个下拉列表存在于所有视图继承的主模板中，所以当加载新视图时，将重新加载模板中的所有内容。因此，下拉列表将重新加载，所选语言将在下拉列表中丢失。而不是在下拉列表中查看应该设置哪个值的URL我想使用本地存储。所以我尝试在下拉列表的onchange函数中设置它：

localStorage.setItem("LanguageSelectStoredUrl", this.value);

但这会保存网址。我想保存文本，即＆＃34;瑞典语＆＃34;并将下拉列表的当前值设置为存储值。这应该有用，对吗？如果是这样，我该怎么做？有什么理由不去？

我想这样做的另一个原因是因为我希望用户在以后的会话中不必再使用以下语言来选择语言：

$(document).onload(function(){
   if(localStorage.getItem("LanguageSelectStoredValue") != null){
      // Check if the dropdown value is equal to the stored value
      // If so do nothing
      // Else reroute to locally stored URL

但由于我不知道如何存储下拉列表的文本值，我无法做到这一点，也许有一个更适合的事件要挂钩而不是onload？

以下是我需要帮助的问题摘要，以便完成手头的任务：

如何获取所选下拉项目的文本？
如何以编程方式选择下拉列表中的某个值？
是否有更好的事件要挂钩而不是onload？

我可能忽略了其他任何事情吗？

谢谢！

Answer 1

要获取下拉列表的选定文本：

JavaScript的：

var languageSelect = document.getElementById("LanguageSelect");
var selectedText = languageSelect.options[languageSelect.selectedIndex].text;

jQuery的：

$('#LanguageSelect option:selected').text();

使用$("#LanguageSelect").val('ValFromDdl');可以选择下拉列表中的项目。
您可以使用$(document).ready来读取存储对象并初始化下拉列表。

使用重新路由和本地存储创建语言下拉菜单

1 个答案: