如何在多语言实施时调整catory ajax过滤器

我目前正在我的网站上 Build 对多种语言的支持 . 该网站的主要语言是荷兰语,我添加了英语 . 一切都很好,但我博客上的ajax类别过滤器却没有 .

荷兰语版本工作正常,英文版本没有 .

类别过滤器确实在博客的英文版本上生成了正确的URL,但它没有显示正确的帖子:当您单击类别过滤器的英文版本上的类别时,它会返回每个荷兰帖子(其中是主要的语言) .

同样的事情发生在分页......

我只是无法弄清楚如何解决这个问题 . 这是正在使用的JS(底部是分页,顶部是类别过滤器):

$(function() {

  // Filter projects and posts
  $(document).on("change", ".category-selection-field input[type=checkbox]", function(){
    var slugs = $('.category-selection-field input[type=checkbox]:checked')
                  .map(function(){return $(this).attr("data-slug")})
                  .get()
                  .join(",");
    var post_type = $(this).attr("data-post-type");
    var get_url = "/apis?categories="+slugs+"&post_type="+post_type;

    window.history.pushState(null, null, "?categories=" + slugs);
    $.ajax({url: get_url , success: function(result){
      $("#post-card-container").html(result).hide().fadeIn(500);
    }});
  });

  // Ajaxify the pagination
  $(document).on("click", ".paginate-navigation-js a", function(e){
    e.preventDefault();

    var stored_params = $(this).attr("href").split("?")[1];
    if(!stored_params.includes("post_type")){
      stored_params += "&post_type=" + $(".category-selection-field input[type=checkbox]").attr("data-post-type");
    }
    var get_url = "/apis?"+stored_params;

    if(get_url != ""){
      $.ajax({url: get_url , success: function(result){
        $("#post-card-container").html(result).hide().fadeIn(500);
        $('html,body').animate({
          scrollTop: $("#post-card-container").offset().top
        }, 500);
      }});
    }
  })

});

有没有办法来解决这个问题?我认为这是一个网址问题,因为/ en /添加到网站英文版的网址上?

该网站使用html / liquid构建 . 如果您需要更多信息,请告诉我 .

The url of the Dutch blog(这是主要的语言网址)

The url of the English blog(这是出问题的地方)

我真的希望你们可以帮我解决这个问题,因为我输了! :)

回答(1)

2 years ago

没关系,我能够通过将HTML标记更改为:

<html lang={{request.language}}>

并将js更改为:

$(function() {

  // Filter projects and posts
  var lang = $("html").attr("lang");
  $(document).on("change", ".category-selection-field input[type=checkbox]", function(){
    var slugs = $('.category-selection-field input[type=checkbox]:checked')
                  .map(function(){return $(this).attr("data-slug")})
                  .get()
                  .join(",");
    var post_type = $(this).attr("data-post-type");
    var get_url = "/"+ lang +"/apis?categories="+slugs+"&post_type="+post_type;

    window.history.pushState(null, null, "?categories=" + slugs);
    $.ajax({url: get_url , success: function(result){
      $("#post-card-container").html(result).hide().fadeIn(500);
    }});
  });

  // Ajaxify the pagination
  $(document).on("click", ".paginate-navigation-js a", function(e){
    e.preventDefault();

    var stored_params = $(this).attr("href").split("?")[1];
    if(!stored_params.includes("post_type")){
      stored_params += "&post_type=" + $(".category-selection-field input[type=checkbox]").attr("data-post-type");
    }
    var get_url = "/"+ lang +"/apis?"+stored_params;

    if(get_url != ""){
      $.ajax({url: get_url , success: function(result){
        $("#post-card-container").html(result).hide().fadeIn(500);
        $('html,body').animate({
          scrollTop: $("#post-card-container").offset().top
        }, 500);
      }});
    }
  })

});