window.blur()メソッド

window.blur()は、ウィンドウのフォーカスを外すメソッド。

構文

<script type="text/javascript">
window.blur();
</script>

サンプルA

サンプルAの動作について

「新たにウィンドウを開く」ボタンをクリックすると、新たなウィンドウを開き、開いたウィンドウを背面に移動する。

2013年6月26日現在、IE9では、フォーカスが外れ背面に移動するが、Firefox、GoogleChromeでは、背面に移動しなかった。

サンプルAのソースコード

JavaScript

<script type="text/javascript">
function sampleOpenWindow() {
    sampleWindow = window.open( '', 'sample', 'width=300,height=300' );
    sampleWindow.document.write( "<p>サンプルウィンドウ</p>" );
    sampleWindow.blur();
}
</script>

HTML

<div class="sample">
    <button onclick="sampleOpenWindow()">新たにウィンドウを開く</button>
</div>

CSS

<style type="text/css">
.sample button {
    font-size: 16px;
}
</style>

サンプルB

2013年6月26日現在、IE9ではフォーカスが外れたが、Firefox、GoogleChromeではフォーカスが外れなかった。

サンプルBの動作について

「新たにウィンドウを開く」ボタンをクリックすると、新たなウィンドウを開き、開いたウィンドウを背面に移動する。

2013年6月26日現在、IE9では、フォーカスが外れ背面に移動するが、Firefox、GoogleChromeでは、背面に移動しなかった。

サンプルBのソースコード

JavaScript

<script type="text/javascript">
window.onload = initialize;
function initialize() {
    document.getElementById( 'sampleOpenWindow' ).onclick = sampleOpenWindow;
}
function sampleOpenWindow() {
    sampleWindow = window.open( '', 'sample', 'width=300,height=300' );
    sampleWindow.document.write( "<p>サンプルウィンドウ</p>" );
    sampleWindow.blur();
}
</script>

HTML

<div class="sample">
    <button id="sampleOpenWindow">新たにウィンドウを開く</button>
</div>

CSS

<style type="text/css">
.sample button {
    font-size: 16px;
}
</style>

スポンサード リンク

カテゴリー: JavaScript, Windowオブジェクト, ブラウザオブジェクト, メソッド, リファレンス, 操作 パーマリンク