正则表达式用 JQuery ui 自动完成替换某些字符

Posted 2023-05-08

【中文标题】正则表达式用 JQuery ui 自动完成替换某些字符

【英文标题】：Regex to replace certain characters with JQuery ui autocomplete

【发布时间】：2020-08-23 05:56:00

【问题描述】：

我有一个使用 jQuery 自动完成功能搜索数据库的输入。它运作良好，但我希望它对某些角色更加宽容。假设数据库中的数据是： oc-5 我需要请求的字符串 oc5 或 oc_5 来匹配数据库中的当前字符串。

如果数据库中的当前值为 ac2，我需要 ac-2 或 ac_2 或 ac-2 或 ac 2 以匹配该值。

实际上，我希望字符“-”、“_”和“”充当通配符。

我想我必须正则表达式我的 request.term 但我不知道该怎么做。

这是我的代码：

$(".autocomplete").autocomplete(  

    delay: 100,
    source: function (request, response) 

        // Suggest URL
        var datatype = this.element.attr('data-type');
        var suggestURL = href+"&datatype="+datatype+"&term="+request.term;

        // JSONP Request
        $.ajax(
            method: 'POST',
            url: suggestURL             
        )
        .success(function(data)
            response(data);
        );
    
);

【问题讨论】：

您可以使用.replace() 替换字符，如下所示：request.term.replace(/[-_\s]/g, "");。这会将出现的连字符、下划线或空格替换为空字符串。

您将无法在请求本身中执行此操作。它需要在服务器上完成。由于您将请求发送到服务器并成功获取列表，因此在服务器上执行查询。这就是您需要分解请求并使其命中数据库中的特定项目的地方。

谢谢@Souleste。这会起作用，但只是部分起作用。我还需要反向匹配的请求。例如：如果数据库中的数据是oc-5，我也需要请求oc5来匹配数据。

【参考方案1】：

由于您想双向使用，您可以在使用替换后检查两个值是否匹配，如果匹配，则使请求值等于数据库值。

其中db_val 是您的数据库值，rq_val 是发送的请求值。

if (db_val.replace(/[-_\s]/g, "") == rq_val.replace(/[-_\s]/g, "")) 
    rq_val = db_val;

如果您不想在字符串的开头或结尾允许列出的特殊字符之一，并且不允许连续出现多个特殊字符，则可以使用此正则表达式：.replace(/^(?:[^-_\s][-_\s]?)3(?<![-_\s])$/, "") .这意味着检查除特殊字符外的任何字符，然后重复三次特殊字符，并确保字符串的结尾没有特殊字符。

我不擅长正则表达式，但这就是我想出的。

【讨论】：

这看起来像要走的路！我只需要找到一种方法将它实现到我的 ajax 函数中。感谢@Souleste 抽出宝贵时间！

@HugoLaporte 运行ajax函数之前你知道数据库值是多少吗？这就是datatype 吗？

@HugoLaporte 您可以运行该 if 语句，如果为 false 则抛出错误弹出窗口并阻止 ajax 运行。或者您可以运行 ajax 并在服务器上进行测试，如果为 false 则返回错误。 - 试图编辑我的其他评论，但为时已晚。

数据类型用于在我的数据库表中选择我的列名

【参考方案2】：

考虑以下代码：

$(".autocomplete").autocomplete(
  delay: 100,
  source: function(request, response) 
    // Suggest URL
    var datatype = this.element.attr('data-type');
    var term = request.term;
    // Example: 'a-c-2' or 'ac_2' or 'ac-2' or 'ac 2'
    term = term.replace(/(-|_|\s)/g, "");
    // Result: ac2
    var suggestURL = href + "&datatype=" + datatype + "&term=" + term;
    $.ajax(
        method: 'POST',
        url: suggestURL
      )
      .success(function(data) 
        response(data);
      );
  
);

您可以在发送之前更新术语，并使用正则表达式从带有.replace() 的字符串中删除任何"-"、"_" 或" " 字符。

工作示例。

$(function() 
  $("button").click(function() 
    var term = $("input").val();
    console.log(term.replace(/(-|_|\s)/g, ""));
  );
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Search: <input type="text" /> <button>Test</button></p>

【讨论】：

感谢 Twisty 的回答！非常感激。但我想只有当我的数据库中的值不包含任何“-”“_”或空格时它才会起作用。假设数据库中的数据是 "ac-2"，我输入的是 "ac2" 或 "ac_2"。有没有办法让它与价值相匹配？再次感谢！

@HugoLaporte 不能直接使用，除非您的数据库中的 dat 有特定格式。如果它始终是 CC-#，那么您可以在发送之前轻松地重新格式化 Term 以匹配它。

感谢您抽出宝贵时间@Twisty 我可以格式化数据库中的数据，但如何让请求返回“ac-2”？我无法为用户更改这些文档代码。带有格式化字符串的第二列？

我会像我一样删除任何奇怪的字符，然后创建一个新字符串。 var nStr = term.slice(0,2) + "-" + term.slice(2,1); 这会将ac2 变成ac-2。现在，当用户输入更多字符时，这将中断。