新版jQuery表示没有语法时出现语法错误

问题描述

我有一个在wordpress主题中使用的功能，并且在最近更新之后jQuery开始在我的网站上引发错误：

 Uncaught Error: Syntax error,unrecognized expression: .mobile_menu > ul > li.has_sub > span.mobile_arrow,.mobile_menu > ul > li.has_sub > h3,.mobile_menu > ul > li.has_sub > a[href*=#]
  at Function.ea.error (jquery.js?x11568:2)
  at ea.tokenize (jquery.js?x11568:2)
  at ea.select (jquery.js?x11568:2)
  at Function.ea [as find] (jquery.js?x11568:2)
  at n.fn.init.find (jquery.js?x11568:2)
  at new n.fn.init (jquery.js?x11568:2)
  at n (jquery.js?x11568:2)
  at initMobileMenu (autoptimize_aaf340fa1b0ef77ca18e853d0b265e53.js:332)
  at HTMLDocument.<anonymous> (autoptimize_aaf340fa1b0ef77ca18e853d0b265e53.js:332)
  at i (jquery.js?x11568:2)

堆栈跟踪将我指向默认情况下名为initMobileMenu的函数。min.js是该函数：

 /*
 ** Show/Hide Mobile menu
 */
 var $j = jQuery.noConflict();
 function initMobileMenu(){
     "use strict";

     $j(".mobile_menu_button span").on('tap click',function(e){
      e.preventDefault();

    if ($j(".mobile_menu > ul").is(":visible")){
        $j(".mobile_menu > ul").slideUp(200);
    } else {
        $j(".mobile_menu > ul").slideDown(200);
    }
});

$j(".mobile_menu > ul > li.has_sub > span.mobile_arrow,.mobile_menu > ul > li.has_sub > a[href*=#]").on('tap click',function(e){
    e.preventDefault();

    if ($j(this).closest('li.has_sub').find("> ul.sub_menu").is(":visible")){
        $j(this).closest('li.has_sub').find("> ul.sub_menu").slideUp(200);
        $j(this).closest('li.has_sub').removeClass('open_sub');
    } else {
        $j(this).closest('li.has_sub').addClass('open_sub');
        $j(this).closest('li.has_sub').find("> ul.sub_menu").slideDown(200);
    }
});

$j(".mobile_menu > ul > li.has_sub > ul.sub_menu > li.has_sub > span.mobile_arrow,.mobile_menu > ul > li.has_sub > ul.sub_menu > li.has_sub > h3,.mobile_menu > ul > li.has_sub > ul.sub_menu > li.has_sub > a[href*=#]").on('tap click',function(e){
    e.preventDefault();

    if ($j(this).parent().find("ul.sub_menu").is(":visible")){
        $j(this).parent().find("ul.sub_menu").slideUp(200);
        $j(this).parent().removeClass('open_sub');
    } else {
        $j(this).parent().addClass('open_sub');
        $j(this).parent().find("ul.sub_menu").slideDown(200);
    }
});

$j(".mobile_menu ul li > a,.mkd_logo a").on('click',function(){

    if(($j(this).attr('href') !== "http://#") && ($j(this).attr('href') !== "#")){
        $j(".mobile_menu > ul").slideUp();
    }
});
} 

我不知道为什么jQuery认为上面存在语法错误？我用这个：https://esprima.org/demo/validate.html，它说我的代码是有效的。我想知道它是否不喜欢我上面的代码中的表达式"a[href*=#]"？

解决方法

您的选择器即使在本机querySelector方法中也存在问题。

document.querySelector('.mobile_menu > ul > li.has_sub > span.mobile_arrow,.mobile_menu > ul > li.has_sub > h3,.mobile_menu > ul > li.has_sub > a[href*=#]');

但是，将引号引起来的哈希（将其视为文字字符）会导致错误不再发生。

document.querySelector('.mobile_menu > ul > li.has_sub > span.mobile_arrow,.mobile_menu > ul > li.has_sub > a[href*="#"]');