-2

I am getting an iframe, in which I am finding an element. I tried to add a keyup event with editable div, but it's not working...

Here is the code:

var iframebody = $(editorid).siblings().find('iframe').contents().find('body');

    var div = $('<div />', 
              {text:textstring, 
                class:'txtMsg mceNonEditable',
                "data-mce-contenteditable":"false",
                css:{'background':'#f2f2f2','margin-bottom':'5px'}});


    var msgDiv = $('<div />', 
                {html:msgText,class:'msgText mceEditable', 
                "data-mce-contenteditable":"true", 
                css:{'margin-bottom':'5px','outline':'0'}})
                .keyup(function(){
                    console.log('keyup'); //not working
                });


    var appender = iframebody.append(div).append(msgDiv);

    console.log(iframebody.find('.mceNonEditable').get(0)); //i am getting the object.

    iframebody.find('.mceNonEditable').on('keyup', function () {
        console.log('hi'); //not working!
    });

Can anyone explain why this approach isn't working?

Matt
  • 74,352
  • 26
  • 153
  • 180
3gwebtrain
  • 14,640
  • 25
  • 121
  • 247
  • 1
    possible duplicate of [Jquery detect change or keyup on body tag within iframe](http://stackoverflow.com/questions/9614545/jquery-detect-change-or-keyup-on-body-tag-within-iframe) –  Mar 08 '15 at 12:12

1 Answers1

0

As per Jquery official site find description is

Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.

and on methods description is

Attach an event handler function for one or more events to the selected elements.

As on is a event like pressing or releasing etc but find is not an event so

console.log('hi'); 

is working

I think if you try something like this

 iframebody.find('.mceNonEditable').trigger('keyup',function () {
        console.log('hi'); //not working!
    });

then you may get your desired result

rocking
  • 4,729
  • 9
  • 30
  • 45