Question

我创建了一个jQuery脚本，如果用户购物车中存在特定产品，则会删除包含文本＆＃34; Royal Mail＆＃34; 的所有投放方式。这在我在谷歌Chrome控制台中运行时非常有效，但在添加到我的网站时它不起作用。

我的理论是，这是因为该网页还没有生成我目标定位的元素，但是我的脚本包含jQuery(document).ready(function(){});，那么这不应该处理这个问题吗？ / p>

请参阅下面的代码：

<script>
    jQuery(document).ready(function() {
        var prodname = jQuery(".product-name").text();
        var method1 = jQuery(".shipment-methods li label:eq(0)");
        var method1val = jQuery(".shipment-methods li label:eq(0)").text();
        var method2 = jQuery(".shipment-methods li label:eq(1)");
        var method2val = jQuery(".shipment-methods li label:eq(1)").text();
        var method3 = jQuery(".shipment-methods li label:eq(2)");
        var method3val = jQuery(".shipment-methods li label:eq(2)").text();
        var method4 = jQuery(".shipment-methods li label:eq(3)");
        var method4val = jQuery(".shipment-methods li label:eq(3)").text();
        var method5 = jQuery(".shipment-methods li label:eq(4)");
        var method5val = jQuery(".shipment-methods li label:eq(4)").text();
        var method6 = jQuery(".shipment-methods li label:eq(5)");
        var method6val = jQuery(".shipment-methods li label:eq(5)").text();
        var method7 = jQuery(".shipment-methods li label:eq(6)");
        var method7val = jQuery(".shipment-methods li label:eq(6)").text();
        var method8 = jQuery(".shipment-methods li label:eq(7)");
        var method8val = jQuery(".shipment-methods li label:eq(7)").text();

        if (
            prodname.includes("Kobra HP Spray Paint - ") ||
            prodname.includes("Kobra Low Spray Paint - ") ||
            prodname.includes("Kobra Spray Paint 600ml - ") ||
            prodname.includes("Krome Spray Paint") ||
            prodname.includes("Kobra Big Black Spray Paint") ||
            prodname.includes("Kobra Low Spray Can Cushion") ||
            prodname.includes("Kobra Bombing Pack") ||
            prodname.includes("Spray Paint 5 Pack - Fluorescent") ||
            prodname.includes("Kobra HP x Mr. Serious Pack") ||
            prodname.includes("Kobra Low Spray Paint - 24 Pack") ||
            prodname.includes("Graffiti Starter Pack") ||
            prodname.includes("Mini Bombing Pack") ||
            prodname.includes("Kobra Low Spray Paint - 12 Pack") ||
            prodname.includes("Kobra Low Spray Paint - 18 Pack") ||
            prodname.includes("Kobra Low Spray Paint - 36 Pack") ||
            prodname.includes("Kobra Spray Paint - 12 Pack") ||
            prodname.includes("Kobra Spray Paint - 18 Pack") ||
            prodname.includes("Kobra Spray Paint - 24 Pack") ||
            prodname.includes("Kobra Spray Paint - 36 Pack")
            ) {
            if (method1val.includes("Royal Mail")) {
                method1.closest("li").css("display","none");
            }
            if (method2val.includes("Royal Mail")) {
                method2.closest("li").css("display","none");
            }
            if (method3val.includes("Royal Mail")) {
                method3.closest("li").css("display","none");
            }
            if (method4val.includes("Royal Mail")) {
                method4.closest("li").css("display","none");
            }
            if (method5val.includes("Royal Mail")) {
                method5.closest("li").css("display","none");
            }
            if (method6val.includes("Royal Mail")) {
                method6.closest("li").css("display","none");
            }
            if (method7val.includes("Royal Mail")) {
                method7.closest("li").css("display","none");
            }
            if (method7val.includes("Royal Mail")) {
                method7.closest("li").css("display","none");
            }
        }
    });
</script>

脚本检查product-name类中是否存在产品名称，然后根据需要删除交付方法。

感谢您提供给我的任何见解。

Answer 1

最有可能的是，在定义/加载jQuery之前，您正在执行代码。确保在您的脚本页面 之前包含jQuery，并将您的脚本放在此包装器中：

jQuery.noConflict(); (function( $ ) { $(function() { // Put your code here, replacing this comment. }); })(jQuery);

作为旁注，在此包装器中，您可以安全地使用$()而不是jQuery()。

还有其他因素可能会影响您的脚本最初无法正常工作，但很可能会这样做。如果没有，您应该检查console log，并告诉我输出的任何错误。

如果那不起作用......

如果上述操作不起作用，则意味着在$(document).ready()事件触发后，页面中的其他脚本会更改页面内容。最常见的是异步调用（ajax）。在这种情况下，您需要命名和存储脚本（我将其放在下面示例中的页面变量中）并在ajax调用返回并在运行success函数后调用它。（还有其他方法可以存储脚本供以后使用，而这个方法虽然简单，但并不是最安全的。）

一个非常重要的注意事项，也是一个常见错误，就是你应该从你的代码中删除$(document).ready(){}包装器，因为如果你在文件准备好之后尝试运行它，它将什么也不做（它会挂钩）过去从未在任何页面中运行过两次的事件。）

通用示例如下：

window.yourVeryUniqueVariableName = function() { jQuery.noConflict(); (function( $ ) { $(function() { // Put your code here, replacing this comment. // Do not wrap your code inside $(document).ready() because that event will // be long fired when your ajax call is successful, so the code will never run! // Place here ONLY the contents of $(document).ready(){} function. }); })(jQuery); };

之后，您需要做的就是从ajax调用的success函数中调用存储在自定义窗口变量中的函数。通用示例：

$.ajax('url_here',{ success:function(response){ // response variable holds the returned response from the ajaxURL. // parse it as you please. // after all parsing, run your function, from the variable in window Object: window.yourVeryUniqueVariableName(); } })

重要提示：您不应该替换ajax调用的success函数的内容，而是添加它。

另外，请注意使用自定义变量填充window对象很难被认为是一种良好的做法，并且容易与使用相同不健康技术的其他人的代码进行命名空间冲突。但我想学习在页面中存储代码的安全实践应该成为另一个重要问题的主题。我这样做了，因为它很快，很脏，可以在适当的时间运行你的代码。

添加到网站时脚本不起作用（在控制台中工作）

1 个答案:

如果那不起作用......