使用Globe互联网服务提供商时JQuery无法正常工作求助
问题概述
- 基于jQuery+Bootstrap的Web应用原本运行正常,突然出现功能失效,更换互联网服务提供商(ISP)后恢复正常,控制台显示第三方CDN资源加载失败。
- 核心代码如下:
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <script> $(document).ready(function() { $('[data-toggle="tooltip"]').tooltip(); // Function to filter data while typing $('#searchInput').on('input', function() { var searchValue = $(this).val().toLowerCase(); $('.employee-row').filter(function() { $(this).toggle($(this).text().toLowerCase().indexOf(searchValue) > -1); }); updateCounter(); }); }); function filterEstablishments() { var statusFilter = document.getElementById("statusFilter").value; var fireDistrictFilter = document.getElementById("fireDistrictFilter").value; var cityFireStationFilter = document.getElementById("cityfirestationfilter").value; var startDateFilter = document.getElementById("startDateFilter").value; var endDateFilter = document.getElementById("endDateFilter").value; var tableRows = document.getElementById("establishmentTableBody").getElementsByTagName("tr"); for (var i = 0; i < tableRows.length; i++) { var statusCell = tableRows[i].querySelector(".status"); var fireDistrictCell = tableRows[i].querySelector(".fire_district"); var cityFireStationCell = tableRows[i].querySelector(".city_fire_station"); var dateOfIssuance1Cell = tableRows[i].querySelector(".dateofissuance1"); var dateOfIssuance2Cell = tableRows[i].querySelector(".dateofissuance2"); var status = statusCell.textContent; var fireDistrict = fireDistrictCell.textContent; var cityFireStation = cityFireStationCell.textContent; var dateOfIssuance1 = dateOfIssuance1Cell ? dateOfIssuance1Cell.textContent : null; var dateOfIssuance2 = dateOfIssuance2Cell ? dateOfIssuance2Cell.textContent : null; var statusMatch = statusFilter === "all" || (statusFilter === "Issued_FSIC" && status === "Issued_FSIC") || (statusFilter === "Issued_NTC" && status === "Issued_NTC"); var fireDistrictMatch = fireDistrictFilter === "all" || fireDistrictFilter === fireDistrict; var cityFireStationMatch = cityFireStationFilter === "all" || cityFireStationFilter === cityFireStation; var dateMatch = true; if (startDateFilter && endDateFilter) { var startDate = new Date(startDateFilter); var endDate = new Date(endDateFilter); if (status === "Issued_FSIC" && dateOfIssuance1) { var issuanceDate = new Date(dateOfIssuance1); dateMatch = issuanceDate >= startDate && issuanceDate <= endDate; } else if (status === "Issued_NTC" && dateOfIssuance2) { var issuanceDate = new Date(dateOfIssuance2); dateMatch = issuanceDate >= startDate && issuanceDate <= endDate; } } if (statusMatch && fireDistrictMatch && dateMatch && cityFireStationMatch) { tableRows[i].style.display = ""; } else { tableRows[i].style.display = "none"; } } updateCounter(); } function updateCounter() { var displayedRows = $('#establishmentTableBody').find('tr:visible').length; $('#recordCounter').text("Total: " + displayedRows); } $(document).ready(function() { $('#addModal').on('show.bs.modal', function(e) { var url = './create.php'; // Replace with the URL of your external page $.get(url, function(data) { $('#addModalBody').html(data); }); }); }); </script>
解决方案
本地托管静态资源(最可靠)
下载jQuery、Popper.js、Bootstrap的JS文件到自己的Web服务器目录(如/static/js/),替换CDN链接为本地路径:<script src="/static/js/jquery-3.5.1.min.js"></script> <script src="/static/js/popper.min.js"></script> <script src="/static/js/bootstrap.min.js"></script>彻底规避ISP对第三方CDN的拦截问题。
添加CDN降级备用方案
保留CDN链接的同时,添加本地备用逻辑,当CDN加载失败时自动切换到本地资源:<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script>window.jQuery || document.write('<script src="/static/js/jquery-3.5.1.min.js"><\/script>')</script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script> <script>window.Popper || document.write('<script src="/static/js/popper.min.js"><\/script>')</script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <script>window.bootstrap || document.write('<script src="/static/js/bootstrap.min.js"><\/script>')</script>升级资源版本
旧版本CDN资源可能存在ISP拦截或服务终止情况,升级到同系列稳定新版本(如jQuery 3.6.4、Bootstrap 4.6.2),更换链接后测试兼容性。优化DNS解析
提示用户切换公共DNS(如Cloudflare 1.1.1.1、Google 8.8.8.8),或在自身域名DNS设置中开启CDN加速,绕过ISP的DNS污染。
内容的提问来源于stack exchange,提问作者bfpncr ICT
相关产品推荐
相关产品推荐

