google chrome调试控制台jquery错误“令牌非法

我正在使用wordpress，我正在尝试运行在wordpress页面中创建的脚本。 在wordpress外部，一切正常，但在wp内部没有被复制。 Google chrome调试控制台显示此错误：

未捕获的SyntaxError:意外的toke非法

脚本如下：

<script>
    jQuery(document).ready(function ($) {
        $("#sys1").click(function () {
            $("#hub img").css("opacity", "0.3");
            $("#thermostat img").css("opacity", "0.3");
            $("#boiler img").css("opacity", "0.3");
            $("#valve img").css("opacity", "0.3");
            $("#sensor img").css("opacity", "0.3");
            $("#plug img").css("opacity", "0.3");
            $("#underfloor img").css("opacity", "0.3");
            $("#hub img").css("opacity", "1");
            $("#thermostat img").css("opacity", "1");
            $("#boiler img").css("opacity", "1");
            $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test divs content add panel 1</div>");
            $("#sys2").removeClass("active");
            $("#sys3").removeClass("active");
            $("#sys4").removeClass("active");
            $("#sys5").removeClass("active");
            $("#sys1").addClass("active");
        });
    });
</script>

有什么想法吗？非常感谢

编辑

以下是我的wp页面中的完整代码：

<div class="page-content-big-title"><h1>System products</h1></div>
<div class="inner-container">
<div class="products-page-products-required-display">
            <ul>
                <li id="hub"><img src="../wp-content/themes/Make-child/img/placeholder.png"/> </li>
                <li id="thermostat"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
                <li id="boiler"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
                <li id="valve"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
                <li id="sensor"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
                <li id="plug"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
                <li id="underfloor"><img src="../wp-content/themes/Make-child/img/placeholder.png" /></li>
            </ul>
        </div>
        <div class="products-page-system-selectors">
            <ul>
                <li id="sys1" class="active">System option</li>
                <li id="sys2">System option</li>
                <li id="sys3">System option</li>
                <li id="sys4">System option</li>
                <li id="sys5">System option</li>
            </ul>
        </div>
        <div class="products-page-system-information-container"><div class='products-page-system-information-added-content'>Test div's content add panel 1</div></div>

</div>
<script>
 jQuery(document).ready(function ($) {
  $("#sys1").click(function() {
                $("#hub img").css("opacity", "0.3");
                $("#thermostat img").css("opacity", "0.3");
                $("#boiler img").css("opacity", "0.3");
                $("#valve img").css("opacity", "0.3");
                $("#sensor img").css("opacity", "0.3");
                $("#plug img").css("opacity", "0.3");
                $("#underfloor img").css("opacity", "0.3");
                $("#hub img").css("opacity", "1");
                $("#thermostat img").css("opacity", "1");
                $("#boiler img").css("opacity", "1");
                $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test divs content add panel 1</div>");
                $("#sys2").removeClass("active");
                $("#sys3").removeClass("active");
                $("#sys4").removeClass("active");
                $("#sys5").removeClass("active");
                $("#sys1").addClass("active");
            });
            $("#sys2").click(function() {
                $("#hub img").css("opacity", "0.3");
                $("#thermostat img").css("opacity", "0.3");
                $("#boiler img").css("opacity", "0.3");
                $("#valve img").css("opacity", "0.3");
                $("#sensor img").css("opacity", "0.3");
                $("#plug img").css("opacity", "0.3");
                $("#underfloor img").css("opacity", "0.3");
                $("#hub img").css("opacity", "1");
                $("#thermostat img").css("opacity", "1");
                $("#valve img").css("opacity", "1");
                $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test div's content add panel 2</div>");
                $("#sys1").removeClass("active");
                $("#sys3").removeClass("active");
                $("#sys4").removeClass("active");
                $("#sys5").removeClass("active");
                $("#sys2").addClass("active");
            });
            $("#sys3").click(function() {
                $("#hub img").css("opacity", "0.3");
                $("#thermostat img").css("opacity", "0.3");
                $("#boiler img").css("opacity", "0.3");
                $("#valve img").css("opacity", "0.3");
                $("#sensor img").css("opacity", "0.3");
                $("#plug img").css("opacity", "0.3");
                $("#underfloor img").css("opacity", "0.3");
                $("#hub img").css("opacity", "1");
                $("#valve img").css("opacity", "1");
                $("#sensor img").css("opacity", "1");
                $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test div's content add panel 3</div>");
                $("#sys1").removeClass("active");
                $("#sys2").removeClass("active");
                $("#sys4").removeClass("active");
                $("#sys5").removeClass("active");
                $("#sys3").addClass("active");
            });
            $("#sys4").click(function() {
                $("#hub img").css("opacity", "0.3");
                $("#thermostat img").css("opacity", "0.3");
                $("#boiler img").css("opacity", "0.3");
                $("#valve img").css("opacity", "0.3");
                $("#sensor img").css("opacity", "0.3");
                $("#plug img").css("opacity", "0.3");
                $("#underfloor img").css("opacity", "0.3");
                $("#hub img").css("opacity", "1");
                $("#thermostat img").css("opacity", "1");
                $("#boiler img").css("opacity", "1");
                $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test div's content add panel 4</div>");
                $("#sys1").removeClass("active");
                $("#sys2").removeClass("active");
                $("#sys3").removeClass("active");
                $("#sys5").removeClass("active");
                $("#sys4").addClass("active");
            });
            $("#sys5").click(function() {
                $("#hub img").css("opacity", "1");
                $("#thermostat img").css("opacity", "1");
                $("#boiler img").css("opacity", "1");
                $("#valve img").css("opacity", "1");
                $("#underfloor img").css("opacity", "1");
                $(".products-page-system-information-container").html("<div class='products-page-system-information-added-content'>Test div's content add panel 5</div>");
                $("#sys2").removeClass("active");
                $("#sys3").removeClass("active");
                $("#sys4").removeClass("active");
                $("#sys5").addClass("active");
            });
        });
</script>

编辑

我通过修改javascript代码解决了这个问题，我认为wordpress没有很好地解释.htmlsome html标记

---

不管怎样，现在它工作正常。谢谢

上面的代码中没有它……如果删除代码，它是否存在？它可能是一个单独的js文件。可能是一个js文件被页眉或页脚加载时出错。