Question

我正在使用列表搜索工具来检查长列表中的特定名称。我已经成功地将名称硬编码到正则表达式中，但是我需要它是动态的。这是代码：

    function processString(){
  document.getElementById('textArea').value = "";
  var inputString = document.getElementById('textBox').value;
  var userIn = document.getElementById('userInput').value;
  var regex = //use variable 'userIn' for regex
  $('#textArea').html(result);

  if(result != null){
    for(var i = 0; i < result.length; i++){
      document.getElementById('textArea').value += result[i] + '\r\n';
    }
  }

}

codepen

Answer 1

您可以通过实例化RegExp对象来创建新的RegExp，如下所示：

var regex = new RegExp(userIn, "ig"); //use variable 'userIn' for regex

第一个参数是从userInput传入的值，第二个是标志。 i 表示不区分大小写- i ， g 表示 g 小数（检查整个字符串，之后不要停找到第一个比赛）

要使用正则表达式根据列表检查名称，请使用：

  var match = inputString.match(regex);

这将返回 inputString

中 regex 的所有匹配项

function processString() {
  document.getElementById('textArea').value = "";
  var inputString = document.getElementById('textBox').value;
  var userIn = document.getElementById('userInput').value;
  var regex = new RegExp(userIn, "ig"); //use variable 'userIn' for regex
  var match = inputString.match(regex);
  if (match !== null) {
    for (var i = 0; i < match.length; i++) {
      document.getElementById('textArea').value += match[i] + '\r\n';
    }
  }

}

<p>List of Names</p><input type="text" id='textBox' style='width:250px;'>
<br><br>
<p>name to search for</p><input type="text" id='userInput' style='width:250px;'>
<br><br>
<input type="button" value='search' style='width:250px;' onclick='processString()'>
<br><br>
<textarea name="area" id="textArea" cols="30" rows="10"></textarea>

Answer 2

首先，您需要转义用户输入，以便正则表达式引擎从字面上理解。通过此answer，我们可以编写如下函数：

  RegExp.escape= function(s) {
      return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
  };

然后，我们可以创建正则表达式。我假设您要使用这样的正则表达式，因为您要搜索名称：

\b<user input here>\b

您可以连接字符串

var regex = new RegExp("\\b" + RegExp.escape(userIn) + "\\b", "g");

完整代码：

function processString(){
  RegExp.escape= function(s) {
    return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
};
  document.getElementById('textArea').value = "";
  var inputString = document.getElementById('textBox').value;
  var userIn = document.getElementById('userInput').value;
  var regex = new RegExp("\\b" + RegExp.escape(userIn) + "\\b", "g");
  
  var result = inputString.match(regex);
  $('#textArea').html(result);
  
  if(result != null){
    for(var i = 0; i < result.length; i++){
      document.getElementById('textArea').value += result[i] + '\r\n';
    }
  }
  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>List of Names</p><input type="text" id='textBox' style='width:250px;'>
<br><br>
<p>name to search for</p><input type="text" id='userInput' style='width:250px;'>
<br><br>
<input type="button" value='search' style='width:250px;' onclick='processString()'>
<br><br>
<textarea name="area" id="textArea" cols="30" rows="10"></textarea>

如何在javascript中将变量传递到正则表达式中？

2 个答案: