Сделайте вызов setTimeout самостоятельно, пока условие не станет истинным

Question

У меня есть поле ввода внутри формы, класс которого изменяется динамически, в зависимости от ajax-скрипта (который я не могу изменить) с "foo" на "foo bar" обратно на "foo".Я хотел бы изменить стиль поля, когда его длина> 0, его значение не содержит «nid» и его класс не является «bar».Моя первая идея заключалась в том, чтобы иметь setTimeout, который вызывается каждый раз, когда классом поля ввода является «bar», пока он не станет «foo».Но я не знаю, является ли это хорошей практикой или как это сделать ...

Answer 1

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

Если оно совпадает, добавьте класс fx baz, если это не такЭто означает, что вы удалили этот класс.

Это позволило бы вам стилизовать элемент с помощью CSS.Создайте правило с классом bar, которое переопределит правило с классом baz.

Answer 2

использовать keyup событие ввода field

Answer 3

Возможно, вы захотите взглянуть мой плагин jQuery для обнаружения ввода пользователя.Он нормализует событие HTML5 oninput во всех основных браузерах, поэтому он может обнаружить ввод с клавиатуры, исправления орфографии, вставки, перетаскивания и т. Д.

Используя этот плагин, ваш код может выглядеть примерно так:

$("#myInput").input(function () {
    var $this = $(this), val = this.value;
    if (val.length && val.indexOf("nid") === -1 && !$this.hasClass("bar"))
        $this.css("color", "red");
    else
        $this.css("color", "green");
});

Рабочая демонстрация: http://jsfiddle.net/hVDP8/

oninput имеет много преимуществ по сравнению с использованием таймеров или события onkeyup, например, выполнение кода до того, как будет нарисовано новое значениена экране.На самом деле, это идеально подходит для такой ситуации.

Answer 4

Все нормально. Или вы можете использовать setInterval, который будет запускаться несколько раз, а затем вызвать clearInterval, как только условие будет выполнено.