CODEWITHSUNDEEP
jqueryfirefoxiframeonbluronfocus
Sadia
Sadia

Reputation: 43

Setting focus and blur events on Iframe body not working with firefox

I have created an editable iFrame as :

<iframe frameborder="0" id="editor"></iframe>

<script type="text/JavaScript">
    document.getElementById('editor').contentWindow.document.designMode="on";                                       
    document.getElementById('editor').contentWindow.document.close();

    $("#editor").contents().find("body").blur(function(){ // Blur functions });

    $("#editor").contents().find("body").focus(function(){// focus functions });

</script>

Focus and Blur events are getting triggered in chrome but not working for firefox.

Upvotes: 0

Views: 1464

Answers (1)

Sadia
Sadia

Reputation: 43

Resolved as :

<iframe frameborder="0" id="editor"></iframe>

<script type="text/JavaScript">
    document.getElementById('editor').contentWindow.document.designMode="on";                                       
    document.getElementById('editor').contentWindow.document.close();

if(navigator.userAgent.indexOf("Firefox") != -1){
    $("#editor").contents().bind('blur', function(){ // Blur functions });
    $("#editor").contents().bind('focus', function(){ // focus functions });
}else{
    $("#editor").contents().find("body").blur(function(){ // Blur functions });
    $("#editor").contents().find("body").focus(function(){ // focus functions });
}
</script>

For firefox it works with focus/blur set on contents() not for body.

Upvotes: 1

Related Questions