HTML属性斜杠转义问题及jQuery表情选择器:/表情报错解决

你遇到的这个问题，核心原因是正则表达式转义不完整。咱们来看你提供的getRegExp方法代码：

getRegExp:function(){
  var ret="/";
  $.each($.mbEmoticons.smilesVariations,function(i){
    var emot= i.replace(/\)/g,"\\)").replace(/\(/g, "\\(").replace(/\|/g, "\\|").replace(/\*/g, "\\*").replace(/\^/g, "\\^");
    ret +="("+emot+")|";
  });
  ret+="/g";
  return eval(ret);
}

这个方法在构建正则的时候，只转义了)、(、|、*、^这些特殊字符，但漏掉了/——而:/里的/是正则表达式的分隔符，直接把未转义的/放进正则字符串里，会导致正则语法错误，自然就报错了。

解决方案 #

只需要在转义逻辑里加上对/的处理就行，修改getRegExp方法中的emot变量赋值部分，补充replace(/\//g, "\\/")：

getRegExp:function(){
  var ret="/";
  $.each($.mbEmoticons.smilesVariations,function(i){
    var emot= i.replace(/\)/g,"\\)")
               .replace(/\(/g, "\\(")
               .replace(/\|/g, "\\|")
               .replace(/\*/g, "\\*")
               .replace(/\^/g, "\\^")
               .replace(/\//g, "\\/"); // 新增：转义斜杠
    ret +="("+emot+")|";
  });
  ret+="/g";
  return eval(ret);
}

另外提一句，你定义的smiles对象里有":/": "sm1"，但smilesVariations里没包含:/的变体，不过这不是报错的原因，只是如果有类似:-/这类变体需要支持的话，可以补充进去。

这样修改后，:/这个表情就能正常被正则识别，不会再触发语法错误了。

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