如何在 jQuery ajaxComplete 中忽略查询字符串匹配 URL-js教程-PHP中文网

本文介绍在使用 jQuery 的 ajaxComplete 事件时，如何正确匹配带动态查询参数（如 ?_=1324346569）的 URL，避免因查询字符串导致匹配失败，核心是采用子字符串包含判断而非全等匹配。

本文介绍在使用 jquery 的 ajaxcomplete 事件时，如何正确匹配带动态查询参数（如 `?_=1324346569`）的 url，避免因查询字符串导致匹配失败，核心是采用子字符串包含判断而非全等匹配。

在实际前端开发中，尤其是 Shopify 等平台的定制场景下，常需监听 /cart.js 等关键资源的 AJAX 加载完成事件。但浏览器或 jQuery 自动添加的时间戳类查询参数（如 ?_=1682345678901）会导致严格相等比较 settings.url === "/cart.js" 永远为 false，从而无法触发预期逻辑。

正确的做法是使用字符串包含检测（.includes()），它能可靠识别 URL 路径部分是否以目标路径开头，而忽略后续查询参数：

jQuery 1.12.4

jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。

下载

$(document).ajaxComplete(function(event, xhr, settings) {
    if (settings.url.includes("/cart.js")) {
        console.log("✅ 成功捕获 cart.js 请求（支持任意查询参数）");
        // 在此处执行更新购物车 UI、刷新数量 badge 等操作
    }
});

⚠️ 注意事项：

.includes() 是 ES6+ 方法，现代浏览器均支持；若需兼容 IE，可改用 settings.url.indexOf("/cart.js") !== -1；
避免使用正则或 new URL() 解析（如 new URL(settings.url).pathname === "/cart.js"），因 settings.url 可能为相对路径或不合法 URL 字符串，引发异常；

若存在多个相似路径（如 /cart.js 和 /cart-items.js），建议使用更精确的匹配方式，例如：

const path = settings.url.split('?')[0]; // 提取路径部分（不含 query）
if (path === "/cart.js") { /* 安全精准匹配 */ }

总结：ajaxComplete 中 URL 匹配应面向“路径语义”而非“完整字符串”。使用 includes() 或路径截断法，既简洁又健壮，是处理动态查询参数的标准实践。