Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jHtmlArea event handling of keypress

I'm currently developping a text-to-symbol conversion tool (non-profit), and I'm having this problem:

For the WYSIWYG-editting of the text, I'd like to use a nice small wysiwyg editor (like jHtmlArea). This editor will show floating divs, so I'll have to intercept a lot of keypresses (spaces/arrows/etc)

Currently, my html area is loaded like this:

<script type="text/javascript">    
$(function() {
            $("#txtCustomHtmlArea").htmlarea({
                 loaded: function() {
                 $(this.editor).keydown(function(event) { 
                     if(event.keyCode == 32) {
                         this.pasteHTML('<b>test</b>');
                         return false;
                     }

                     return true;
                });
            }

The problem with this code is that this.editor doesn't have the method pasteHTML. How can I use this method from this(=htmlarea).event?

This is most probably a fairly beginner question, but I'm really clueless towards where to look.

Thank you

like image 650
Zack Effr Avatar asked Nov 14 '22 12:11

Zack Effr


1 Answers

Here's how I do it:

    $("#my-text-area").htmlarea({
        loaded: function () {
            $.myControl = { jhtmlarea: this };
        }
    });

Then I can reference:

$($.myControl.jhtmlarea.editor.body).keypress(function (e) { });

This also gives me a handle to my the html area object from outside of the iFrame.

like image 80
Zack Avatar answered Dec 09 '22 16:12

Zack