jQuery .click()执行报错：无法识别含空格的表达式#B%20Group

嘿，这个问题我之前也踩过坑！咱们一步步拆解清楚：

你遇到的错误Uncaught Error: Syntax error, unrecognized expression: #B%20Group，核心原因有两个：

1. 选择器规则限制：jQuery的选择器基于CSS规范，#开头的ID选择器里，空格、%这类特殊字符都是非法的——解析器根本认不出#B%20Group这种写法。
2. URL编码的干扰：当你用#B Group作为href值时，浏览器会自动把空格编码成%20，所以实际DOM里的href是#B%20Group，而你用原始带空格的字符串拼接选择器时，jQuery会把编码后的字符串当成选择器的一部分，直接触发语法错误。

几个可行的解决办法： #

1. 最稳妥：修改元素标识符，去掉空格

这是一劳永逸的方案，把“B Group”改成B-Group、BGroup或者B_Group这类无空格的名称，之后不管是用$('#B-Group')还是$('a[href="#B-Group"]')都不会有问题，也符合HTML的最佳实践。

2. 必须保留空格？用原生JS绕开选择器解析

如果没法修改ID/名称，那可以用原生的document.getElementById()来获取元素——它可以直接识别带空格的ID，再转成jQuery对象：

// 直接获取带空格的目标元素
var targetElement = $(document.getElementById('B Group'));

这种方法完全避开了jQuery的选择器解析器，自然不会触发语法错误。

3. 针对href属性的精确匹配

如果是通过href选择元素，别直接写带空格的选择器，而是用filter()方法精确匹配原始的href值：

var targetLink = $('a').filter(function() {
  return $(this).attr('href') === '#B Group';
});

或者直接匹配浏览器编码后的href值：

var targetLink = $('a[href="#B%20Group"]');

结合你的代码片段修正 #

参考你的代码逻辑，大概可以改成这样：

$(document).on('click', '.groups-activity .glyphicon-list', function () {
  var target = $(this).parents('tr');
  var name = target.find('.group-name').text().trim(); // 假设这是获取到的"B Group"
  // 方法1：用原生JS获取目标元素
  var groupElement = $(document.getElementById(name));
  // 或者方法2：用filter匹配对应链接
  var groupLink = $('a').filter(function() {
    return $(this).attr('href') === '#' + name;
  });
  // 执行你的点击逻辑
  groupElement.click();
});

总结一下：尽量别在ID、选择器里用空格这类特殊字符，真要用到的话，就用原生方法或者filter绕开jQuery的选择器解析坑~

内容的提问来源于stack exchange，提问作者Lab Lab