Question

我想要实现的是匹配除two, Two, TWO个词之外的每个单词和字符。此代码是表单验证的一部分，其中two, Two, TWO是验证码问题的答案：

//if(! event.target.validity.valid) {
if(! event.target.validity.valid && input.value === /(^(?!two$|Two$|TWO$).*)/gm) {
  elem.className = 'error';
  parentDiv.className += ' error-input';
  elem.style.display = 'block';
};

不幸的是，这不起作用。

更新

我在这里尝试了所有正则表达式，最后也是循环，但仍然无法正常工作。我在这里复制了整个函数，以便更多地查看正在发生的事情：

var lang = document.getElementsByTagName('html')[0].getAttribute('lang');

(function() {
  function field(name, langif, langelse) {

    var elem = document.createElement('div');
    elem.style.display = 'none';

    var input = document.getElementById(name);
    var parentDiv = document.getElementsByClassName(name)[0];
    input.parentNode.appendChild(elem);

    // Turning on when error is presented
    input.addEventListener('invalid', function(event) {
      event.preventDefault();
      if(!event.target.validity.valid && name !== 'captcha') {
        elem.className = 'error';
        parentDiv.className += ' error-input';
        elem.style.display = 'block';
      };
      if(!event.target.validity.valid && name === 'captcha' && input.value === input.value.match(/(^(?!kettő$|ketto$|Kettő$|Ketto$|KETTŐ$|KETTO$|two$|Two$|TWO$).*)/gm)[0]) {
        elem.className = 'error-captcha';
        parentDiv.className += ' error-input-captcha';
        elem.style.display = 'block';
      };
      if(!event.target.validity.valid && lang === 'hu-HU') {
        elem.textContent = langif;
      } else {
        elem.textContent = langelse;
      };
    });

    // Turning off when error is not presented
    input.addEventListener('input', function() {
      if(elem.style.display === 'block') {
        elem.className = '';
        parentDiv.classList.remove('error-input');
        elem.style.display = 'none';
      };
    });

    return;
  };

  // Init function
  field('firstname', 'A keresztnév kötelező és/vagy számokat tartalmazott.', 'Firstname is required and/or the field had numbers.');
  field('surname', 'A vezetéknév kötelező és/vagy számokat tartalmazott.', 'Surname is required and/or the field had numbers.');
  field('email', 'Email cím kötelező. Ajánlott formátum: valami@domain.hu', 'Email address is required. Recommended format: something@domain.com');
  field('message', 'Üzenet mező kitöltése kötelező.', 'Message is required.');
  field('captcha', 'Captcha kitöltése kötelező.', 'Captcha is required.');

})();

预期行为：如果输入字段为空，则抛出错误。如果输入字段与描述的验证码答案不匹配，则抛出错误。现在只有在输入字段为空时才有效。

更新2：

JSFiddle：https://jsfiddle.net/Lanti/ja77k6ca/2/

仅限相关代码：https://jsfiddle.net/Lanti/ja77k6ca/8/

Answer 1

此if声明正在尝试查看input.value，字符串是否等于/(^(?!two$|Two$|TWO$).*)/gm，正则表达式

它们属于不同的类型，因此永远不会平等。

您应该使用String.prototype.match()来查看input.value是否与正则表达式匹配。

这应该会给你想要的结果：

// check to see if calling "match" on the
// regular expression returns the user input

if(! event.target.validity.valid && input.value === input.value.match(/(^(?!two$|Two$|TWO$).*)/gm)[0]) {
  elem.className = 'error';
  parentDiv.className += ' error-input';
  elem.style.display = 'block';
};

Answer 2

为什么不呢：

var captchaAnswers = {'two': true, 'Two': true, 'TWO': true};

if(!event.target.validity.valid && !(input.value in captchaAnswers)) {
    ...
};

编辑：您的实际问题来自于字段非空时未在输入上触发的无效事件。要使它触发事件，您应该在输入元素上使用pattern属性。

查看更新的JSFiddle。

RegExp：在Javascript

2 个答案: