23

onblurイベントリスナーを含む入力タグがあります。

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

JavaScriptを介して、この入力でblurイベントをトリガーし、doSomething関数を呼び出します。

私の最初の考えは、ぼかしと呼ぶことです。

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

しかし、それは機能しません（エラーはありませんが）。

これは行います：

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

何故ですか？.click()onclickリスナーを介して要素にアタッチされたクリックイベントを呼び出します。なぜblur()同じように機能しないのですか？

4

3 に答える 3

29

これ：

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

要素（<input>）には、値が関数である「onblur」という属性があるため、機能します。したがって、それを呼び出すことができます。ただし、ブラウザに実際の「ぼかし」イベントをシミュレートするように指示しているわけではありません。たとえば、作成されたイベント オブジェクトはありません。

要素には「ぼかし」属性（または「メソッド」など）がないため、最初のことが機能しません。

于 2011-03-06T19:10:40.817 に答える
12

先のとがったこととは反対に、このblur()方法は存在し、w3c標準の一部です。次の例は、すべての最新のブラウザー（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

于 2011-03-06T19:23:04.527 に答える
2

入力がフォーカスを失った結果としてonblur イベントが呼び出されたためだと思います。ボタンに関連付けられたクリックアクションがあるように、入力に関連付けられたぼかしアクションはありません。

于 2011-03-06T19:06:40.520 に答える