Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   отмена получения фокуса (https://javascript.ru/forum/events/7583-otmena-polucheniya-fokusa.html)

x-yuri 09.02.2010 01:18

отмена получения фокуса
 
ну пускай фокус нельзя отменить с помощью return false/preventDefault. Но что самое интересно, если вызвать blur в обработчике focus (из-за щелчка мышью) в ff, то событие фокус возникает еще раз на том же элементе. Кто-нибудь может объяснить физику процесса?

Для полноты картины: опера не вызывает onblur, а в chrome, похоже, эти события не реализованы.

тестовый код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <script type="text/javascript">
    function d( t ) {
        var br = document.createElement('br');
        document.body.appendChild( br );
        var n = document.createTextNode( t );
        document.body.appendChild( n );
    }
    </script>
</head>
<body>

<a href="#" 
   onblur="d('blur');"
   onfocus="d('focus');
            this.blur();">link</a>

</body>
</html>

x-yuri 10.02.2010 19:00

или может есть более цивилизованные пути решения проблемы?

e1f 10.02.2010 19:32

Кстати, это при клике. Если выделить ссылку табом, то в ФФ будет только одна пара focus-blur, мышью - две.

UPD Вот, похоже, на эту тему: https://bugzilla.mozilla.org/show_bug.cgi?id=53579

e1f 10.02.2010 21:14

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<head>
<script type="text/javascript">
    function init() {
        for ( var i in {
            'DOMActivate': 1,
            'click': 1,
            'mousedown': 1,
            'mouseup': 1,
            'contextmenu': 1
        } ) document.body.firstChild.addEventListener(i, function(e){
            d( e.type );
        }, true);
    }
    function d( t ) {
        var br = document.createElement('br');
        document.body.appendChild( br );
        var n = document.createTextNode( t );
        document.body.appendChild( n );
    }
    function f( target ) {
        d('focus');
        target.nextSibling.focus();
    }
</script> 
</head> 
<body onload="init()"><a href="#" onblur="d('blur')" onfocus="f(this)">link</a><a href="#">.</a></body> 
</html>


При mousedown на link -- двойной focus/blur. При это фокус вроде как на второй ссылке. Ппц...

UPD Ммм, а если нажимать средней кнопкой -- все гут :)

e1f 11.02.2010 02:46

В общем, если задача стоит просто не допустить фокуса "любой ценой" :), то вроде бы достаточно так:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<head>
<script type="text/javascript">
    function d( t ) {
        var br = document.createElement('br');
        document.body.appendChild( br );
        var n = document.createTextNode( t );
        document.body.appendChild( n );
    }
</script> 
</head> 
<body><a href="#"
    onblur="d('blur')"
    onfocus="d('focus');this.blur()"
    onmousedown="d('mousedown');this.blur();return false"
    oncontextmenu="d('contextmenu');this.blur();return false;">link</a>
</body> 
</html>

x-yuri 11.02.2010 04:39

bug вроде не про то

Цитата:

Сообщение от e1f
При mousedown на link -- двойной focus/blur. При это фокус вроде как на второй ссылке. Ппц...

причем получается так
focus0
blur0
focus1
blur1
focus0
blur0
focus1

но вообще дело в том, что смена фокуса происходит внутри обработчика смены фокуса. Чувствуешь, м? :) (хотя могло бы и работать) Если изменить фокус после завершения обработчиков, то все ok
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html>
<head>
<script type="text/javascript">
    function d( t ) {
        var br = document.createElement('br');
        document.body.appendChild( br );
        var n = document.createTextNode( t );
        document.body.appendChild( n );
    }
</script> 
</head> 
<body>
    <a href="#" onfocus="
        d('focus0')
        var self = this;
        setTimeout( function() {
            self.nextSibling.focus();
        }, 0);
    "
    onblur="d('blur0')"
    >link0</a
    ><a onfocus="d('focus1')" 
       onblur="d('blur1')" href="#">link1</a>
</body> 
</html>


Цитата:

Сообщение от e1f
В общем, если задача стоит просто не допустить фокуса "любой ценой" , то вроде бы достаточно так:

ну любой ценой вроде не надо было. Да и blur в onfocus хватает. Просто странно ff себя ведет...

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

Serg_pnz 11.02.2010 10:49

Цитата:

Вообще задача была примерно такая: есть ссылка выполненная в виде картинки, и вокруг нее эта рамочка появлялась... совсем не в тему
Это не так лечится)))
Это лечится в css:
a {outline: none;}

Спасибо http://www.htmlbook.ru/faq/?a=67

Octane 11.02.2010 12:52

Цитата:

Сообщение от Serg_pnz
a {outline: none;}

а для IE есть какое-то свойство в JS, попробую вспомнить…

--------

а вот нашел http://webmaster.ee/javascript/JavaS...html#hideFocus

e1f 11.02.2010 13:08

Пуф, точно не в ту степь :)

subzey 11.02.2010 16:35

Я обычно использую
a img {border: none; outline: none} a {outline: none}
 — убирает бордюр и изображений и пунктирную рамку вокруг активной ссылки в Fx


Часовой пояс GMT +3, время: 22:58.