Как определить, содержит ли строка определенный символ в JavaScript?


335

У меня есть страница с текстовым полем, где пользователь должен ввести 24-значный регистрационный код (буквы и цифры, без учета регистра). Я использовал, maxlengthчтобы ограничить пользователя вводом 24 символов.

Регистрационные коды обычно задаются в виде групп символов, разделенных черточками, но я бы хотел, чтобы пользователь вводил коды без черточек.

Как я могу написать свой код JavaScript без jQuery, чтобы проверить, что данная строка, которую вводит пользователь, не содержит тире или, что еще лучше, содержит только буквенно-цифровые символы?


2
Ответ, найденный здесь stackoverflow.com/questions/3192612, содержит информацию о том, как проверять буквенно-цифровые символы.
JasCav

1
И выучить регулярные выражения: регулярные выражения.info
Феликс Клинг

Для вас jquery люди, вы должны и могли бы использовать inArray.
Джон

3
Как форматируется ввод, это не проблема человека. Это проблема компьютера. Возьмите все, что пользователь вводит, и удалите все символы, которые не принадлежат (не альфа), проверьте, чтобы увидеть результат длиной 24 символа, затем проверьте его. Пользователь действительно ненавидит форматированный ввод.
Tggagne

Ответы:


592

Чтобы найти "привет" в your_string

if (your_string.indexOf('hello') > -1)
{
  alert("hello found inside your_string");
}

Для буквенного числа вы можете использовать регулярное выражение:

http://www.regular-expressions.info/javascript.html

Буквенно-цифровое регулярное выражение


Это было довольно полезно. Выступая в качестве программиста на Python, я использую его для замены ключевого слова «in» (которое может быть или не быть неортодоксальным, я не уверен), но оно работает не только для одного символа.
trevorKirkby

1
Я не понимаю, как за это проголосовали в ответ. Я вижу, что многие люди приходят сюда, используя Google. Определенно, лучшим способом было бы использование регулярного выражения.
Спок

25
Вы бы использовали регулярное выражение для проверки одного символа? Это чрезмерное количество накладных расходов, чтобы получить то же самое, что делает встроенная функция. Есть много людей, которые не понимают регулярное выражение, и, как правило, лучший ответ - лучший.
kemiller2002

Я бы пошел с /hello/g.test(your_string). Несмотря на то, что indexOf работает, я думаю, что тест на регулярные выражения лучше рассказывает о том, чего вы пытаетесь достичь. Если я пытаюсь найти последовательность символов внутри строки, индекс не имеет значения.
Джо Маффей


69

С ES6 .include ()

"FooBar".includes("oo"); // true

"FooBar".includes("foo"); // false

"FooBar".includes("oo", 2); // false

E: Не поддерживается IE - вместо этого вы можете использовать оператор Tilde ~( Bitwise NOT ) с .indexOf ()

~"FooBar".indexOf("oo"); // -2 -> true

~"FooBar".indexOf("foo"); // 0 -> false

~"FooBar".indexOf("oo", 2); // 0 -> false

Используется с числом, эффективен оператор Тильды ~N => -(N+1). Используйте его с двойным отрицанием !!( логическое НЕ ) для преобразования чисел в bools:

!!~"FooBar".indexOf("oo"); // true

!!~"FooBar".indexOf("foo"); // false

!!~"FooBar".indexOf("oo", 2); // false

Простой, читаемый и возвращает логическое значение. Идеально подходит, когда вам не нужно регулярное выражение.
Брайанбраун

1
** Пожалуйста, обратите внимание, что метод
include

52

Если у вас есть текст в переменной foo:

if (! /^[a-zA-Z0-9]+$/.test(foo)) {
    // Validation failed
}

Это проверит и убедится, что пользователь ввел хотя бы один символ и вводил только буквенно-цифровые символы.


Лучший ответ здесь, все остальные ответы нулевые из моего POV.
chris_r


11

ES6 содержит встроенный метод ( includes) в String prototype, который можно использовать для проверки, содержит ли строка другую строку или нет.

var str = 'To be, or not to be, that is the question.';

console.log(str.includes('To be')); 

Следующий polyfill может быть использован для добавления этого метода в неподдерживаемых браузерах. ( Источник )

if (!String.prototype.includes) {
  String.prototype.includes = function(search, start) {
    'use strict';
    if (typeof start !== 'number') {
      start = 0;
    }
    
    if (start + search.length > this.length) {
      return false;
    } else {
      return this.indexOf(search, start) !== -1;
    }
  };
}


7

Используйте регулярное выражение для достижения этой цели.

function isAlphanumeric( str ) {
 return /^[0-9a-zA-Z]+$/.test(str);
}

Это проверит ровно одну цифру и не примет все буквенно-цифровые символы, как того пожелает OP.
cdhowie

@cdhowie .. забыл +, но я тоже неправильно прочитал вопрос .. спасибо за указание.
Габриэле Петриоли

6

Вы все слишком усердно думаете. Просто используйте простое регулярное выражение, это ваш лучший друг.

var string1 = "Hi Stack Overflow. I like to eat pizza."
var string2 = "Damn, I fail."

var regex = /(pizza)/g // Insert whatever phrase or character you want to find

string1.test(regex); // => true
string2.test(regex); // => false

Выучите регулярные выражения за 5 минут?


Таким образом, чтобы сделать что-то практичное с этим, вы просто запустите это в подборке:if ( string1.test(regex) ) { alert("He likes pizza!"); }
Адам Макартур

И ваш буквенно-цифровой тест будет ... var regex = /^[a-z0-9]+$/i
Адам Макартур

4
Это задом наперед. См developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... regexObj.test (ул)
Ральф Yozzo

Это задом наперед? regex.test(string1)
Hlcs

Ваши примеры методов обратны. Так и должно быть regex.test(str). ( str.match(regex)похоже, но не возвращает логическое значение.)
jsejcksn

6

Если вы ищете символ (ы) в начале или в конце строки, вы также можете использовать startsWithиendsWith

const country = "pakistan";
country.startsWith('p'); // true
country.endsWith('n');  // true


4

Чтобы проверить только буквенно-цифровые символы:

if (/^[0-9A-Za-z]+$/.test(yourString))
{
    //there are only alphanumeric characters
}
else
{
    //it contains other characters
}

Регулярное выражение проверяет 1 или более (+) из набора символов 0-9, AZ и az, начиная с начала ввода (^) и заканчивая концом ввода ($).


4

Ответ Кевинса правильный, но для него требуется «магическое» число:

var containsChar = s.indexOf(somechar) !== -1;

В этом случае вам нужно знать, что -1 означает « не найден» . Я думаю, что немного лучшая версия будет:

var containsChar = s.indexOf(somechar) >= 0;

Ну, в соответствии с исходным , текущим и черновым стандартами, indexOf()вернет -1, если строка не найдена. Так что это вряд ли больше волшебства, чем использование 0 .
Все работники являются необходимыми


3

Функция поиска String тоже полезна. Он ищет символ, а также подстроку в данной строке.

'apple'.search('pl') возвращается 2

'apple'.search('x') возвращение -1


2

Если вы читаете данные из DOM, такие как тег ap или h1, например, вам нужно использовать две встроенные функции JavaScript, это довольно просто, но ограничено es6, по крайней мере, для решения, которое я собираюсь предоставить. Я буду искать все p-теги в DOM, если текст содержит «T», весь абзац будет удален. Я надеюсь, что этот маленький пример поможет кому-то!

HTML

<p>Text you need to read one</p>
<p>Text you need to read two</p>
<p>Text you need to read three</p>

JS

let paras = document.querySelectorAll('p');

paras.forEach(p => {
  if(p.textContent.includes('T')){
       p.remove();
    } 
});

1

Работает отлично. Этот пример очень поможет.

<script>    
    function check()
    {
       var val = frm1.uname.value;
       //alert(val);
       if (val.indexOf("@") > 0)
       {
          alert ("email");
          document.getElementById('isEmail1').value = true;
          //alert( document.getElementById('isEmail1').value);
       }else {
          alert("usernam");
          document.getElementById('isEmail1').value = false;
          //alert( document.getElementById('isEmail1').value);
       }
    }
</script>

<body>
    <h1>My form </h1>
    <form action="v1.0/user/login" method="post" id = "frm1">
        <p>
            UserName : <input type="text" id = "uname" name="username" />
        </p>
        <p>
            Password : <input type="text" name="password" />
        </p>
        <p>
            <input type="hidden" class="email" id = "isEmail1" name = "isEmail"/>
        </p>
        <input type="submit" id = "submit" value="Add User" onclick="return check();"/>
    </form>
</body>

0

Демонстрация: метод include () находит символ «содержит» во всей строке, он возвращает true.

var string = "This is a tutsmake.com and this tutorial contains javascript include() method examples."

str.includes("contains");

//The output of this

  true


0

Проверьте, является ли строка буквенно-цифровой или буквенно-цифровой + некоторые допустимые символы

Самый быстрый алфавитно-цифровой метод, вероятно, как упомянуто в: Лучший способ алфавитно-цифровой проверки в Javascript, поскольку он работает непосредственно с диапазонами номеров.

Затем, чтобы разумно использовать несколько дополнительных символов, мы можем просто поместить их вSet быстрый поиск.

Я считаю, что эта реализация будет правильно работать с суррогатными парами .

#!/usr/bin/env node

const assert = require('assert');

const char_is_alphanumeric = function(c) {
  let code = c.codePointAt(0);
  return (
    // 0-9
    (code > 47 && code < 58) ||
    // A-Z
    (code > 64 && code < 91) ||
    // a-z
    (code > 96 && code < 123)
  )
}

const is_alphanumeric = function (str) {
  for (let c of str) {
    if (!char_is_alphanumeric(c)) {
      return false;
    }
  }
  return true;
};

// Arbitrarily defined as alphanumeric or '-' or '_'.
const is_almost_alphanumeric = function (str) {
  for (let c of str) {
    if (
      !char_is_alphanumeric(c) &&
      !is_almost_alphanumeric.almost_chars.has(c)
    ) {
      return false;
    }
  }
  return true;
};
is_almost_alphanumeric.almost_chars = new Set(['-', '_']);

assert( is_alphanumeric('aB0'));
assert(!is_alphanumeric('aB0_-'));
assert(!is_alphanumeric('aB0_-*'));
assert(!is_alphanumeric('你好'));

assert( is_almost_alphanumeric('aB0'));
assert( is_almost_alphanumeric('aB0_-'));
assert(!is_almost_alphanumeric('aB0_-*'));
assert(!is_almost_alphanumeric('你好'));

GitHub вверх по течению .

Протестировано в Node.js v10.15.1.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.