SYNCERのロゴ
アイキャッチ画像

HTMLElement.blur() - フォーカスを外す

blur()は、HTMLElementのメソッドです。要素に対するフォーカスを外します。

概要

名前
blur
所属
HTMLElement
IDL
void blur();
仕様書
https://html.spec.whatwg.org/multipage/interaction.html#dom-blur

説明

このメソッドに引数はありません。返り値もありません。

チュートリアル

フォーカスを外す例です。

<input id="hoge">
// 要素を取得する
var element = document.getElementById( "hoge" ) ;

// 要素のフォーカスを外す
element.blur() ;

デモ

HTMLElement.blur()のデモです。入力フォームにフォーカスして、そのまま待って下さい。3秒後にblur()を実行してフォーカスを外します。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<head>
<style>
div#result {
	white-space: pre-wrap ;
}

input {
	width: 50% ;
	font-size: 16px ;
}
</style>
</head>
<body>
	<p><input id="hoge"></p>
<script>
/** try it! **/
var element = document.getElementById( "hoge" ) ;

element.addEventListener( "focus", function ( event ) {
	setTimeout( function () {
		element.blur() ;
	}, 3000 ) ;
} ) ;
/** try it! **/
</script>
</body>
</html>

サポート状況

クリックすると、バージョンごとの対応状況を確認できます。

ChromeFirefoxSafariEdgeIEOperaiOS SafariAndroid
  • Twitterでシェア
  • Facebookでシェア
  • Google+でシェア
  • はてなブックマークでシェア
  • pocketに保存
  • LINEでシェア
更新履歴
2017年10月3日 (火)
コンテンツを公開しました。