Есть форма для ввода ссылки. В режиме реального времени проверяем, что пользователь начал писать ссылку с
http://
или
https://
. Задал переменной hyper = RegExp и подставил в условие через test(), которое находится в функции обработчика keyup.
Для наглядности отдельный элемент будет менять цвет на зеленый если true и на красный - false.
Вопрос такой.
Если переменную объявить внутри функции обработчика, то все нормально. Т.е. когда мы ввели
http://
, то далее блок всегда зеленый, но мне нужна глобальная переменная, т.к. нужно эту же переменную подставить в другой обработчик и как то не красиво будет если ее множить.
А глобальная начинает "мигать", когда мы ввели
http://
и продолжили ввод. Поясните это поведение и посоветуйте как вывернуть так, чтобы нормально отрабатывало с глобальной переменной.
Посмотреть здесь.
<div class="card-body">
<form action="">
<input tyle='text' id='long-link' name="link">
</form>
</div>
var long = $('#long-link'), hyper = new RegExp ('^https://|^http://','g');
long.keyup(function(){
if (hyper.test(long.val())) {
$('.card-body').css({'background':'#4cfa76'});
}
else $('.card-body').css({'background':'#af1d1d'});
});