CODEWITHSUNDEEP
jqueryhtmliframewysihtml5
Herald Charley
Herald Charley

Reputation: 101

capture keyup event inside dynamically loaded iframe

I have a text editor which uses wysihtml5. I think the text editor is loaded in an iframe. I need to capture the key up event inside the text editor. And how do i prevent scrolling inside this text editor.

The code below loads the text editor

<textarea name="message" id="message" maxlength="10000" class="span12 inbox-editor wysihtml5 m-wrap" rows="12">sample text</textarea>

any suggestion appreciated

Upvotes: 2

Views: 2173

Answers (2)

Alvin Ang
Alvin Ang

Reputation: 211

Agreed with @Waxolunish, here is a sample implementation where I try to capture the "tab" keypress event:

$('#wysihtml5').each(function(i, elem) {
  $(elem).wysihtml5({
    "font-styles": true,
    "emphasis": true,
    "lists": true, 
    "html": true, 
    "link": true,
    "image": true,
    "color": false,
    "events": {
      "focus": function() {
        $('.wysihtml5-sandbox').contents().find('body').on("keydown",function(event) {          
          event.preventDefault();              
          var keyCode = event.keyCode || event.which;

          if (keyCode == 9){
             // do something & remember to add all the closing tags..

Good luck!

Upvotes: 0

Christian
Christian

Reputation: 4094

If you are using wysihtml5 by xing you can do it this way:

 $('.textarea').wysihtml5({
    events: {
      load: function() {
        $('.wysihtml5-sandbox').contents().find('body').on("keydown",function(event) {
          //your key event
        }); 
      }
    }
  });

I don't get the point what the problem is with scrolling.

Upvotes: 3

Related Questions