Форум

autosoft · #1 (**permalink**) 03.07.2012, 12:17

Добрый день. Вопрос к знатокам.

Почему в броузере Opera элемент input (file) не генерирует событие onblur при переходе фокуса на div?

Пробовал в разных браузерах: IE, FF, Safari, Chromium - все так как должно быть.

В Opera - при переходе с <input type=file id='file1'> на <div tabindex=0>div</div> событие onblur не настает.
Почему? Как побороть?

<script language='JavaScript 1.5' type='text/JavaScript'>
 
dofocus = function (event) { document.title += 'F'; }
doblur = function (event) { document.title += 'B'; }

</script>
<html>
	<body>
		<input type=file id='file1' onfocus='dofocus();' onblur='doblur();'>
		<div tabindex=0>div</div>
		<input type=file id='file2' onfocus='dofocus();' onblur='doblur();'>
		<input type=file id='file3' onfocus='dofocus();' onblur='doblur();'>
	</body>
</html>

Deff · #2 (**permalink**) 03.07.2012, 12:33

autosoft,
Имхо по-моему в Опере, если только input type=file находится внутри формы с name="..."(*сказал на всякий случай),
Поскольку вне формы все эти деяния с type=file без толку в любом браузе, считать из input type=file может только форма

<script type="text/javascript">
 
function dofocus() {alert('A')}
function doblur () {alert('B')}

</script>
<form id="upload" method="post" enctype="multipart/form-data" action="/upload7">
		<input type=file id='file1' onfocus='dofocus();' onblur='doblur();'><br />
		<div tabindex=0>div</div><br />
		<input type=file id='file2' onfocus='dofocus();' onblur='doblur();'><br />
		<div tabindex=0>div</div><br />
		<input type=file id='file3' onfocus='dofocus();' onblur='doblur();'><br />
</form>

autosoft · #3 (**permalink**) 03.07.2012, 12:47

Это понятно. Пусть тогда такой пример:

<script>

dofocus = function (event) { document.title += 'F'; }
doblur = function (event) { document.title += 'B'; }

</script>
<html>
	<body>
		<form action='/'>
			<input type=file id='file1' onfocus='dofocus();' onblur='doblur();'>
			<div tabindex=0>div</div>
			<input type=file id='file2' onfocus='dofocus();' onblur='doblur();'>
			<input type=file id='file3' onfocus='dofocus();' onblur='doblur();'>
		</form>
	</body>
</html>

Все равно не работает.
Интересно, что если вместо "file" указать, например "text" - то все события генерируются в Opere так же как и в других браузерах.
Но нужно именно "file" и div с фокусом тоже нужен.

Deff · #4 (**permalink**) 03.07.2012, 12:49

autosoft,
Пример Выше

autosoft · #5 (**permalink**) 03.07.2012, 12:56

Пример Выше
Не работает этот пример. Ни в Opera12 (Linux) ни в Opera12 (Windows).

Событе onblur в Opera при переходе с input на div не настает.

bes · #6 (**permalink**) 03.07.2012, 15:35

Почему не настаёт, настаёт, можно проверить, пощёлкав на Tab, или выбрать какой-нибудь файл в опере (в хроме это не прокатит), вот если в опере файл не выбрать обработчик onfocus не сработает (в хроме по-любому не сработает), onblur соответственно тоже.

Deff · #7 (**permalink**) 03.07.2012, 15:44

Сообщение от bes

вот если в опере файл не выбрать обработчик onfocus не сработает

у мну всё работает версия 9.5 10.5 11.5

bes · #8 (**permalink**) 03.07.2012, 15:52

Сообщение от Deff

у мну всё работает версия 9.5 10.5 11.5

да, всё чётко и так работает, значит я где-то блажанул, пока экспериментировал

вот в хроме вообще не пашет, this.focus() не помогает для input type="file"

bes · #9 (**permalink**) 03.07.2012, 16:35

Для хрома, оперы и FF пока лучший вариант

<input type=file onclick='dofocus()' onchange="this.focus()" onblur='doblur()'>

в IE возникает лишний вызов onblur

autosoft · #10 (**permalink**) 03.07.2012, 17:18

Хорошо. Тогда все по-порядку (по примеру который дал Deff - но сути дела это не меняет):

1. Указываем в Opere: file://localhost/home/user/www/index.html.
Можно разместить файл на работающем сайте - эффект тот же.

2. Нажимаем Enter.
Открывается страничка с тремя input type=file и div между ними.

3. Нажимаем Tab.
Инициируется событие onfocus первого input.
Открывается диалог alert.

4. Нажимаем Esc.
Закрывается диалог alert.

5. Нажимаем Tab.
Ничего не происходит, но курсор перемещается на кнопку первого input.
Первый input все еще активен.

6. Нажимаем Tab.
Курсор переходит на первый div.

7. Нажимаем Tab.
Инициируется событие onfocus второго input.
Открывается диалог alert.

8. ...

Во всех браузерах (кроме Opera) на 6-м шаге инициируется событие onblur первого input.
В Opera - нет. Тестировал на Opera 11 и Opera 12.

Форум

Справочник

Discord чат

Курсы javascript