Разница событий event и click

@Сергей1980 · Регистрация: 17.12.2009

Студворк — интернет-сервис помощи студентам

Коллеги, всем привет!
Возник один вопрос по поводу срабатываний событий focus и click.
Представим себе простенькую процедуру, которая на нажатие тега <td> в таблице выводит его содержимое в alert:

JavaScript
1
2
3
4
5
6
7
8
$(document).ready(function(){
 
$('td').on('click',function(event){
var x =$(this).text();
alert(x);
});
 
});

Все отлично работает. click отрабатывает без проблем. Но вот если я пытаюсь поставить фокус в тег <td> аналогичным образом, то почему то функция не отрабатывает:

JavaScript
1
2
3
4
5
6
7
8
$(document).ready(function(){
 
$('td').on('focus',function(event){
var x =$(this).text();
alert(x);
});
 
});

Два вопроса:
1) Почему не работает focus, а click работает?
2) Может ли тег <td> вообще принимать фокус?

Коллеги, прошу по минимуму философии и побольше конкретики.

Я сейчас собираю табличный мини фреймворк, изучаю досконально возможности Jquery. Делаю грид аля эксель /аксесс. (на последнее это предложение комментариев не надо))

@koza4ok · 16.09.2013, 15:17

http://learn.javascript.ru/focus-blur

По умолчанию не все элементы поддерживают эти события. Перечень элементов немного рознится от браузера к браузеру, например, список для IE описан в MSDN. Но есть элементы, которые поддерживают фокусировку всегда. В первую очередь это те, c которыми посетитель может взаимодействовать: INPUT, SELECT, A и т.п.

С другой стороны, элементы для форматирования, такие как DIV, SPAN, TABLE и другие — по умолчанию не поддерживают это событие, т.е. на них нельзя «фокусироваться». Впрочем, существует способ включить фокусировку и для них.

@Сергей1980 · 16.09.2013, 20:08 **[ТС]**

Вот кстати span то и поддерживает фокус что самое странное..если его запихнуть внутрь td, как контейнер, то все работать начинает.
Как понимаю это именно фишка Jquery, а не чистого javascript.
Представьте, что у вас есть некая таблица, любая ,в формате html.
И я хочу чтобы в фокусе на ячейку <td> выводился редактируемый <input> (ну чтобы прямо там можно было все редактировать не отходя от кассы).
Все норма, работает следующая процедура:

JavaScript
1
2
3
4
5
6
7
8
9
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
....
<script type="text/javascript">
$('table').on('focus','td span', function GotFocus(event){
var span=$(this), parent=span.parent();
parent.html('<input type="text" tabindex="1" value=" '+ span.text() +' ">');
parent.children('input').focus();
});
</script>

Заметил интересную и непонятную закономерность, если я tabindex в <span> и <input> добавляю то процедура отлично срабатывает. Как только убираю данный атрибут, то перестает работать. Не могу понять почему. Event и this в данном контексте должны не зависеть от табиндекса. Странно..

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Access VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .