修复正则表达式的textarea

问题描述

我从here找到了这段代码。它将正则表达式验证功能添加到文本区域。它可以工作，但我无法找出要使用的正确正则表达式，即可完成我想要的操作。

$(document).ready(function() {
  var errorMessage = "Please match the specified format.";

  $(this).find("textarea").on("input change propertychange",function() {

    var pattern = $(this).attr("pattern");

    if (typeof pattern !== typeof undefined && pattern !== false) {
      var patternRegex = new RegExp("^" + pattern.replace(/^\^|\$$/g,'') + "$","g");

      var hasError = !$(this).val().match(patternRegex);

      if (typeof this.setCustomValidity === "function") {
        this.setCustomValidity(hasError ? errorMessage : "");
      } else {
        $(this).toggleClass("error",!!hasError);
        $(this).toggleClass("ok",!hasError);
        if (hasError) {
          $(this).attr("title",errorMessage);
        } else {
          $(this).removeAttr("title");
        }
      }
    }

  });


  $("#reset").click(function() {
    $("#form1").reset();
    if ($('[name ="textA5"]').hasClass("error")) {
      $("#form1").toggleClass("error");
    }
  });

});

.error {
  background-color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form1" id="form1">
  <textarea name="textA5" rows="8" cols="80" wrap="off" pattern="^([A-Za-z0-9-_]{1,}\|{2}(unlimited)(\r\n|\n|\r){0,1}){1,}$"></textarea>
  <span class="errMSG">You have an error. Check format.</span>
  <input class="buttons" type="reset" name="Reset" id="reset" value="Reset" />
  <input class="buttons" type="submit" value="Save Configuration" />
</form>

我无法让我的正则表达式按预期工作。

pattern="^([A-Za-z0-9-_]{1,}$"

为简单起见，在此示例中，即使正则表达式将允许其他字符，也要显式使用 2 |||无限 。

正则表达式每行只允许一个实例 2 |||无限 ，并且文本区域中不能有空行。

很遗憾，我当前的正则表达式还允许 2 || unlimited2 || unlimited 。

我应该对正则表达式进行哪些更改？

解决方法

在您尝试的模式中，您将外部组重复1次或更多次，而在内部组中将匹配1次或更多次[A-Za-z0-9-_]+，然后是\|{2}(unlimited)。

由于外部组和可选的换行符的重复，该模式可以匹配2||unlimited模式的1倍或更多倍

---

您可以从[A-Za-z0-9-_]+或[\w-]+开始匹配，然后在字符串末尾匹配双倍和无限。

^(?:[\w-]+\|{2}unlimited(?:\r?\n|$))+$

Regex demo