Метка: frontend

  • Javascript. Валидация (проверка) email.

    Работая на чистом Javascript нередко возникает необходимость проверки правильности ввода email-адреса. В этой статье приведу пример функции, которой пользуюсь сам для этой задачи. Ниже приведу простой пример реализаци поставленной задачи: function validateEmail(email) { var re = /^(([^()\[\]\\.,;:\s@»]+(\.[^()\[\]\\.,;:\s@»]+)*)|(«.+»))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; return re.test(email); } alert( validateEmail(‘aaaaa’) ); // false alert( validateEmail(‘me@onfor.info’) ); // true В примере показана функция validateEmail,…

  • jQuery. Как открепить плагин (how to unbind plugin)?

    Использование jquery-плагинов давно стало нормой — но бывает необходимость подключить плагин, а потом отключить его. Рассмотрим, как решить эту проблему. У меня было текстовое поле, которое в зависимости от определенных условий должно было быть или текстовым полем для email или полем для ввода номера телефона с маской ввода. Делать отдельные поля и скрывать\отображать нужный не…

  • JavaScript. Как программно переключить вкладку (tab)?

    Сегодня появилась необходимость программного переключения вкладок на bootstrap tabs. Решение очевидное — но сразу пошел не верным путём — поэтому сейчас раскажу, как быстро и правильно переключить bootstrap вкладку. На самом деле — все сверх-просто, причем, конечно же, есть в Документации. Но, тем не менее — не будет лишним еще раз указать исковые методы. Итак:…

  • Адаптивное YouTube видео на сайте при помощи CSS

    При вставке видео YouTube к себе на сайт Вы непременно столкнетесь с проблемой на правильного его отображения. К счастью сделать адаптивный вывод youtube-видео на сайте достаточно просто. В этой статье речь пойдет именно об этом. Итак, нужно выполнить несколько простых шагов. Поехали: 1. Сначала берем ролик, и под ним нажимаем кнопку «Поделиться», а в появившемся…

  • Highcharts. Ajax-загрузка сообщения в tooltip.

    Часто в tooltip нужно загрузить больше информации, чем мы передаем непосредственно в диаграмму. Или же загрузить дополнительные или обработанные данные. Вариантов — множество. Рассмотрим пример ajax-вызова при отображении tooltip в Highchart\Highstock. Для изменения внешнего вида стандартного tooltip предусмотрен параметр formatter: ….. tooltip: { formatter: function() { return ‘Текст, который переопределит стандартный tooltip.’ ; }, ………

  • jQuery. Chosen. Как обновить список?

    Не знаю, кто как — но я очень часто работаю с плагином Chosen. Быстрый, легкий, удобный — что еще нужно. Но на просторах сети есть много вопросов по поводу его обновления в случае изменения исходного селекта. Ниже просто пример события обновления Chosen. Итак, пользуясь издержкой из Документациии: Updating Chosen Dynamically: If you need to update…

  • Javascript. Как получить первый ключ с объекта?

    При работе с данными на Javascript работа с объектами — т.е. с ассоциативными массивами, если говорить на языке php — занимает особое место. При этом может возникнуть типичная ситуация, когда нужно получить первый по-порядку ключ объекта. Задача, на самом деле очень проста: Object.keys( your_object )[0]; Вот, собственно и все. При помощи данного метода, ка Вы…

  • Css. Bootstrap. Как установить жирность текста.

    У bootstrap есть множество классов-хелперов, позволяющих легко давать контенту определенные свойства — например, .text-center — выровняет содержимое по центру. Сегодня задался вопросом — есть ли соответствующий класс для жирности текста. Ответом сейчас и поделюсь. Ответ достаточно просто. Подобного класса — нет. : ) Точнее он есть — и называется — .font-weight-bold, но лишь в bootstrap…

  • Bootstrap. Как скрывать popover при клике на любом месте?

    В коробке bootstrap есть отличный компонент — popover. Но при работе с ним возникает неприятность — он не закрывается при клике на любом месте страницы. О том, как это исправить я расскажу в этой статье. Скажу честно — этот вариант не претендует на изысканность или красоту — но он рабочий, выполняет свою функцию, при этом…

  • Javascript. Как остановить запущенный таймер?

    Функции setInterval() и setTimeout() выполняют свои задачи — но работать с ними не удобно, когда следует обрабатывать скрипт до определенного момента. Сейчас приведу найденный на просторах stackoverflow пример остановки запущенного таймера. Итак, код с пояснениями ниже. // объявляем глобальную переменную var timer; function endAndStartTimer() { // вырубаем запущенный таймер window.clearTimeout(timer); // если таймер надо продолжать…