Blur() против onblur()

У меня есть входной тег с прослушивателем событий onblur:

<input id="myField" type="input" onblur="doSomething(this)" />

Через JavaScript я хочу вызвать событие размытия на этом входе, чтобы он, в свою очередь, вызывал функцию doSomething.

Моя первоначальная мысль - вызвать размытие:

document.getElementById('myField').blur()

Но это не работает (хотя и не ошибка).

Это делает:

document.getElementById('myField').onblur()

Почему? .click() будет вызывать событие click, прикрепленное к элементу, через прослушиватель onclick. Почему blur() работает не так?

Ответ 1

Это:

document.getElementById('myField').onblur();

работает, потому что ваш элемент (<input>) имеет атрибут "onblur", значение которого является функцией. Таким образом, вы можете это назвать. Вы не, говорящие браузеру, чтобы имитировать фактическое событие размытия; там, например, не создается объект события.

Элементы не имеют атрибута "размытия" (или "метода" или чего-то еще), поэтому первое, что не работает,

Ответ 2

В отличие от того, что говорит pointy, метод blur() существует и является частью стандарта w3c. Следующий exaple будет работать в каждом современном браузере (включая IE):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Javascript test</title>
        <script type="text/javascript" language="javascript">
            window.onload = function()
            {
                var field = document.getElementById("field");
                var link = document.getElementById("link");
                var output = document.getElementById("output");

                field.onfocus = function() { output.innerHTML += "<br/>field.onfocus()"; };
                field.onblur = function() { output.innerHTML += "<br/>field.onblur()"; };
                link.onmouseover = function() { field.blur(); };
            };
        </script>
    </head>
    <body>
        <form name="MyForm">
            <input type="text" name="field" id="field" />
            <a href="javascript:void(0);" id="link">Blur field on hover</a>
            <div id="output"></div>
        </form>
    </body>
</html>

Обратите внимание, что я использовал link.onmouseover вместо link.onclick, потому что иначе сам клик удалил бы фокус.

Ответ 3

Я предполагаю, что только потому, что событие onblur вызывается в результате потери фокуса ввода, нет никакого действия размывания, связанного с входом, например, есть действие click, связанное с кнопкой