JavaScript » Web Мастерская | Блог

Блог

Добавить

Web Мастерская

Информация Подключиться

Событие при потере фокуса: (JavaScript: onBlur)

JavaScript

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

Выделить

function job() {
    // Код функции выполняемый при потере фокуса
};

Вызов функции job:

Выделить

<input type="text" id="input" onBlur="job();">

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

Выделить

function job() {
    var text = document.getElementById('input').value;
    text = text.replace(/(^\s*)|(\s*)$/g, '');
    if (text.length < 3) {
        alert('Символов должно быть не менее трех.');
    };
};

Как только фокус будет потерян в input, функция начнет выполнятся....

Жалоба

Динамическое обновление контента (Без перезагрузки страницы Ajax jQuery)

JavaScript Библиотека JS Контент

Потребовалось постоянное обновление одного блока страницы, без перезагрузки самой страницы, на мой взгляд лучшее решение это использовать AJAX. Вот как я сделал обновляющий блок:
В шапку сайта подключил jQuery:

Выделить

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

Строчкой ниже написал небольшой JS:

Выделить

<script type="text/javascript">
function mode() {
    $.ajax({
        url: 'mode.php',
        success: function(data) {
            $('#display').html(data);
        }
    });
};

setInterval(mode, 10000);
</script>

В шаблоне странице, там, где мне нужен самообновляющийся блок добавляю DIV:

Выделить

<div id="display"></div>

Вот и все, теперь блок работает, как и было задумано!

Что же за строки кода я такие тут нагородил?
Думаю,что про подключенный файл jquery.min.js объяснять не стоит, тут и так понятно, но если, что, то: Как подключить библиотеку jQuery. Вот дальше я создал функцию JS mode(), которая...

Жалоба

1 комментарий

Событие при изменении значения формы (JavaScript: onInput)

JavaScript

Событие onInput сработает, когда значение формы будет изменено.
Событие onInput не ждет потерю фокуса, оно срабатывает сразу же, как только значение будет изменено.
Пример:

Выделить

<input type="text" id="input" onInput="job();">

JavaScript:

Выделить

function job() {
    var input = document.getElementById('input');
    alert(input.value);
};

После изменения текста в форме, появится модальное окно с текстом из формы....

Жалоба

Как проверить существует ли функция на JS

JavaScript

Может потребоваться проверить существует ли функция или нет. Для проверки будем использовать оператор typeof, данный оператор возвращает информацию о типе операнда. Нам достаточно сравнить строчку, что вернет typeof со словом function. Делаем так:

Выделить

if (typeof NameFunction == 'function') { 
    alert('Функция существует.');
    NameFunction(); // Если функция существует и её необходимо запустить 
}
else {
    alert('Функция не существует.');
};

Код из пример выводит сообщение:

Функция не существует.

Так как функция NameFunction не существует. Если такую функцию создать, например:

Выделить

function NameFunction() {
    alert('Функция запущена');
};

То проверка выводит:

Функция существует.

А затем запустит саму функцию....

Жалоба

Поиск по сайту на JavaScript

JavaScript

Как подсказывает мне коллега - эта тема не актуальна, и понятно почему, так как поиск по сайту должен выполняться на стороне сервера, а JS выполняется на стороне клиента. Поиск на JS можно сделать на текущей страницы, это будет удобно пользователю, например, когда на одной странице написана большая статья, читатель вбивает слово, которое он хочет найти в поисковую форму, нажимает кнопку Поиск и на странице сразу выделяются все найденные слова, страница при этом не перезагружается. Тут, сценарий ищет совпадения в пределах документа, который уже загружен (кстати, такое умеет делать практически любой браузер (клавиши Ctrl + F)), а как сделать поиск по всему сайту, даже по тем страницам, которые еще не загружены, как это сделать на чистом JS?

Когда у меня еще не было своего места в интернете (хостинга), под мои странички, я ставил эксперименты на статических страницах (наверно многие так делали|делают). У меня была специальная папка на рабочем столе, где хранились всякие написанные мной...

Жалоба