使用复选框更改网址并选择

Question

我使用select和带有jquery的复选框创建一个过滤系统，我希望当我点击其中一个复选框时，url会更改一个参数，当在select中选择一个选项时，我们会添加一个额外的参数一个值，我的问题是，当我选择其中一个选项时，url中的参数不适合我想要的，这是我想得到的结果，这是我的代码，谢谢你的帮助。

码

$(':checkbox').on('change', function(){

  var path = '';
  var url = window.location.href;

     $(':checkbox').each(function(){
        if(this.checked){
            var checkedVals = $(':checked').map(function(){ return $(this).val(); }).get().join();
            window.history.pushState(null, null,'http://127.0.0.1/api/s.php?tags='+checkedVals);
        }

     });

});

$('select').on('change', function(){
    var selected = $(this).find('option:selected').attr('value');
    var currentUrl = window.location.href;
    window.history.pushState(null, null, currentUrl + '&type='+selected);
})

这是我想要的结果

Answer 1

试试这个

function pushState(){
         var path = '';
         var url = window.location.href;
         var checkedVals = '';
         $(':checkbox').each(function(){
           if(this.checked){
             checkedVals = $(':checked').map(function(){ return $(this).val(); }).get().join();
           }
         });

         var selected = $('select').find('option:selected').attr('value');
         window.history.pushState(null, null,'?tags='+checkedVals+ '&type='+selected);
    }
    $(':checkbox').on('change', function(){
        pushState();
    });

    $('select').on('change', function(){
        pushState();
    });

这会对你有所帮助

Answer 2

试试这个

$(':checkbox').on('change', function(){
    pushState();
});

$('select').on('change', function(){
    pushState();
})

function pushState(){
     var path = '';
     var url = window.location.href;
     var checkedVals = '';
     $(':checkbox').each(function(){
       if(this.checked){
         checkedVals = $(':checked').map(function(){ return $(this).val(); }).get().join();
       }
     });

     var selected = $(this).find('option:selected').attr('value');
     window.history.pushState('', '','http://127.0.0.1/api/s.php?tags='+checkedVals+ '&type='+selected);
}