Как мне сделать что-то, когда ввод текста нажат?

0

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

У меня есть форма входа в систему:

<table id="login_form">
    <tr>
        <td class="login_label">Username: </td>
        <td><input type="text" class="login_input" /></td>
    </tr>
    <tr>
        <td class="login_label">Password: </td>
        <td><input type="password" class="login_input" /></td>
    </tr>
</table>

и код jQuery:

$(".login_input")
    .focus(function(){
        alert("Why do I never get this alert?");
    }
);

почему, когда я нажимаю на одно из двух полей ввода текста, предупреждение не отображается? Если я изменю "фокус" на "готов", тогда я получаю предупреждение, поэтому я предполагаю, что с этим что-то с этим.

  • 0
    присвойте обоим полям ввода отдельный идентификатор, а затем добавьте к ним фокусировщик
  • 0
    Я боюсь, что с этими исправлениями вы будете получать оповещения один за другим.
Показать ещё 2 комментария
Теги:
input
text
focus

4 ответа

2
Лучший ответ

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

Демо-версия

$(document).read(function(){
   $(".login_input").focus(function(){
        alert("Why do I never get this alert?");
    });
});

Обработчик, переданный в.ready(), должен быть выполнен после того, как DOM готов, поэтому это обычно лучшее место для присоединения всех других обработчиков событий и запуска другого кода jQuery. При использовании скриптов, которые полагаются на значение свойств стиля CSS, важно ссылаться на внешние таблицы стилей или внедрять элементы стиля перед ссылкой на скрипты, ссылку.

Поделиться
  • 0
    Гуд, я никогда не знал этого, спасибо +1
  • 0
    Добро пожаловать и спасибо @dholakiyaankit
0

Причина, по которой не появляется предупреждение, отсутствует обертка $(document).ready(function() {...});

Добавление, которое создает другую проблему, inifinite loop of alerts:

  • вы выбираете одно из полей
  • поле получает фокус
  • фокусное событие при запуске
  • отображается предупреждение
  • нажмите "ОК" или "ESC"
  • предупреждение закрыто
  • поле получает фокус назад
  • фокусное событие снова запущено...

Почему это так описано в бесконечном цикле события jQuery focus() с элементом. Вы можете попробовать использовать $(this).blur(); :

$(document).ready(function() {
    $(".login_input").focus(function() {
        $(this).blur();
        alert("Here is my alert!");
    });
});

но проблема будет почти такой же.

В некоторых реальных приложениях, скорее всего, вы не будете вызывать alert(). Например, изменение alert() в console.log проблему:

$(document).ready(function() {
    $(".login_input").focus(function() {
        console.log("field in focus");
    });
});
Поделиться
0

Демо- версия http://jsfiddle.net/vNCs2/

API:

Хотя JavaScript предоставляет событие загрузки для выполнения кода при визуализации страницы, это событие не запускается до тех пор, пока все активы, такие как изображения, не будут полностью получены. В большинстве случаев сценарий можно запустить, как только иерархия DOM будет полностью построена. Обработчик, переданный в.ready(), должен быть выполнен после того, как DOM готов, поэтому это обычно лучшее место для присоединения всех других обработчиков событий и запуска другого кода jQuery. При использовании скриптов, которые полагаются на значение свойств стиля CSS, важно ссылаться на внешние таблицы стилей или внедрять элементы стиля перед ссылкой на скрипты.

Код

$(function () {
$(".login_input").focus(function(){
        alert("now you do?");
    }
);
});
Поделиться
0

Заверните свой код в $(document).read(function(){<code here>}); который запустит код после того, как документ будет готов:

$(document).read(function(){
   $(".login_input").focus(function(){
        alert("Why do I never get this alert?");
   });
});

Демо-версия:

http://jsfiddle.net/2DS3g/

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню