如何修改jQuery的data属性选择器实现部分匹配（最少5字符）

要实现输入内容作为data-name属性值的子串（最少5个字符）的匹配，你可以用jQuery的属性包含选择器，同时加上输入长度校验，具体修改如下：

直接使用属性包含选择器 #

var input = "TestText123";
// 校验输入长度是否满足最少5字符要求
if (input.length >= 5) {
  var found = $("#list").find(".box[data-name*='" + input + "']").addClass("found");
}

• 核心是用[data-name*='"+input+"']选择器：它会匹配所有data-name属性值中包含input字符串的.box元素，完美满足“输入是属性值一部分”的需求。
• 新增的长度判断input.length >=5，确保只有符合字符数要求时才执行匹配逻辑。

更安全的filter过滤方式（推荐） #

如果输入内容可能包含特殊字符（比如引号、反斜杠），直接拼接选择器容易出问题，建议用filter()方法结合data()判断：

var input = "TestText123";
if (input.length >= 5) {
  var found = $("#list").find(".box").filter(function() {
    // 用includes判断data-name值是否包含输入内容
    return $(this).data("name").includes(input);
  }).addClass("found");
}

这种方式通过遍历元素并直接读取data-name的值进行判断，既符合“基于data属性处理”的要求，又能避免特殊字符导致的选择器语法错误。

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