如何启动 Ajax 并使用下拉按钮传递文化？

问：

我正在使用 ASP.NET 7 开发一个多语言应用程序。

我尝试使用 AJAX 方法启动控制器，执行必要的更改并在加载视图后更改 DOM。

问题是没有执行包含 AJAX 方法的 JavaScript 代码。

非常感谢您的支持！

在我的 中，我有以下代码：View

<button aria-haspopup="true" data-toggle="dropdown" type="button" id="page-header-country-dropdown" aria-expanded="false" class="btn header-item">
  <img src="~/assets/images/flags/gb.svg" class="mh-16" alt="English">
  <span class="ml-2 d-none d-sm-inline-block">EN</span>
</button>
<div aria-labelledby="page-header-country-dropdown" id="countries" class="dropdown-menu-right dropdown-menu">
  <a href="javascript:void(0);" class="dropdown-item">
    <img class="mr-1 mh-12" src="~/assets/images/flags/gb.svg" alt="English">
    <span class="align-middle" data-lang="en">English</span>
  </a>
  <a href="javascript:void(0);" class="dropdown-item">
    <img class="mr-1 mh-12" src="~/assets/images/flags/sp.svg" alt="Spanish">
    <span class="align-middle" data-lang="sp">Español</span>
  </a>
  <a href="javascript:void(0);" class="dropdown-item">
    <img class="mr-1 mh-12" src="~/assets/images/flags/fr.svg" alt="German">
    <span class="align-middle" data-lang="fr">Français</span>
  </a>
  <a href="javascript:void(0);" class="dropdown-item">
    <img class="mr-1 mh-12" src="~/assets/images/flags/tr.svg" alt="Türkçe">
    <span class="align-middle" data-lang="tr">Türkçe</span>
  </a>
</div>

我的是：controller

[HttpGet]
public IActionResult ChangeLanguage(string culture) {
  Response.Cookies.Append(
  CookieRequestCultureProvider.DefaultCookieName,
  CookieRequestCultureProvider.MakeCookieValue(new RequestCulture(culture)),
  new CookieOptions(){ Expires = DateTimeOffset.UtcNow.AddYears(1) });
  return Redirect(Request.Headers["Referer"].ToString());
}

当我单击元素时，我启动以下 AJAX 代码：#countriesdropdown-item

$("#countries .dropdown-item").on("click", function () {
  $.ajax({
    url: '/Client/Home/ChangeLanguage',
    type: 'GET',
    dataType: 'html',
    data: { cultureInfo },
    success: function () {
      $("#countries .dropdown-item").html(response);
      var icon = $(this).children("img").attr("src");
      var lang = $(this).children("span").attr("data-lang");
      lang = lang.toUpperCase()
      $("#page-header-country-dropdown").children("img").attr("src", icon)
      $("#page-header-country-dropdown").children("span").text(lang)
    },
    error: function (xhr, textStatus, errorThrown) {
    }
  });
})

我需要使用 AJAX 来执行控制器，并在加载页面后，更改 DOM 函数，函数放置在 success 中。 如果没有 AJAX，DOM 将被更改，但当程序执行时：

return Redirect(Request.Headers["Referer"].ToString());

放置在控制器的操作中，页面将再次加载并加载初始英语。因此，DOM 修改丢失了。ChangeLanguage()

为什么我的 JavaScript 代码没有使用 AJAX 执行？ 我做错了什么？