iframe内の入力ボックスでFocusOutイベントが発生していない

iframe内に入力ボックスがあります。iframe内の入力ボックスでFocusOutイベントが発生していない

$("iframe").contents().find('#testDiv').on('keypress input focusout', 'input', function(event) { 
    alert(event.type); 
});

両方keypressとinputイベントはIFRAME内の入力ボックスに解雇されています。私はこのような入力ボックスにkeypress、inputとfocusoutイベントリスナーを添付しています。しかし、focusoutイベントは、入力ボックスのぼかしでは発生しません。

入力ボックスがiframe内に配置されていない場合、同じ構文とイベントバインディングがうまく機能します。 3つのイベントはすべて、iframe内にない入力ボックスで発生します。

注： iframe内のコンテンツが動的なので、イベント委任を使用しています。

HTMLマークアップ：

<iframe> 
    <body> 
    </body> 
</iframe> 
<div id="testDiv1"> 
    <input type="text" /> 
</div>

Javascriptのコード：ここで私が試したもののモックアップです

var $iframe = $("iframe"); 
var iframe = $iframe[0]; 
var doc = iframe.document; 
var content = '<div id="testDiv"><input type="text" /></div>'; 
if (iframe.contentDocument) { 
    doc = iframe.contentDocument; 
} else if (iframe.contentWindow) { 
    doc = iframe.contentWindow.document; 
} 
doc.open(); 
doc.writeln(content); 
doc.close(); 

$("iframe").contents().find('#testDiv').on('keypress input focusout', 'input', function(event) { 
    alert(event.type); 
}); 

$('#testDiv1').on('keypress input focusout', 'input', function(event) { 
    alert(event.type); 
});

：JSFiddle Demo

が助けてください！入力ボックスをiframeから移動することはできません。

出典

2016-04-13 user3613129

第1に、focusinとfocusoutは、IEによって作られたバブリングをサポートする2つのイベントです。しかし、jqueryはこのイベントを他のブラウザでもシミュレートします。

がさえぼかしのみ、（下記参照）の入力にイベントをターゲットとし、フォーカスが（Chromeでテストした）トリガーされます：

第二に、唯一の信頼できるターゲットは（https://www.w3.org/TR/DOM-Level-3-Events/#event-type-focusoutリンクを参照してください）イベント委任のために使用することができます。

$("iframe").contents().find('#testDiv input').on('focusout focusin focus blur', function(event) { 
    alert('lol: ' + event.type); 
});

だから私は推測する、そのためのストレートな答えはありません。このイベントを親フレームに通知するiframeコンテンツにJSを追加する必要があります。

出典

2016-04-13 14:35:51

まさに私がテストしていたものです。フォーカスとぼかしがiFrame内からトリガーされた唯一のイベントであることを確認できます –

Dang！つまり、iframe内に 'blur'イベントや' focus'イベントを委譲する方法はありませんか？ – user3613129

情報ありがとうございました:)。私はこの答えを受け入れるべきですが、もう少しの反応を待つでしょう。 – user3613129

iframe内の入力ボックスでFocusOutイベントが発生していない

答えて

関連する問題