输入文本同步URL重复拼接故障求助：AJAX代码修复指导

嘿，我一眼就看出问题出在哪了——你的代码里有两个关键错误导致了URL参数重复拼接，咱们一步步来修复：

问题根源分析 #

• 错误使用window.location：你直接把window.location（这是一个Location对象）和字符串拼接，它会被转换成包含当前完整URL的字符串（包括已有的参数），所以每次输入字符时，你都在已经带参数的URL后面又加了新的参数，自然就会重复。
• 未定义的变量keywords：代码里用了keywords但没定义，应该是你想用之前获取的search变量才对。

修复后的代码 #

function searchFilterInput(page_number) {
    page_number = page_number ? page_number : 0;
    var search = $('#search').val();
    // 只获取当前页面的路径（比如index.php），而不是完整带参数的URL
    var baseUrl = window.location.pathname;
    
    $.ajax({
        type: 'POST',
        url: 'getData.php',
        data: 'page=' + page_number + '&search=' + search,
        success: function (data) {
            // 生成干净的URL：路径 + 单一的searchText参数
            var newUrl = baseUrl + '?searchText=' + encodeURIComponent(search);
            window.history.replaceState("object or string", "Page Title", newUrl);
        }
    });
}

额外优化建议 #

• 用encodeURIComponent()包裹search：避免输入特殊字符（比如空格、&）时破坏URL结构。
• 如果需要保留其他可能的URL参数，可以用URLSearchParams来更优雅地管理参数，比如：

  var params = new URLSearchParams();
  params.set('searchText', search);
  // 如果需要保留page参数，可以加上：params.set('page', page_number);
  var newUrl = baseUrl + '?' + params.toString();
  

这样修改后，不管你输入多少次字符，URL都会保持index.php?searchText=cleveland的干净格式，不会再出现重复拼接的问题啦！

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