开发者

how a cursor blinks in jQuery text editor?

开发者 https://www.devze.com 2023-01-11 18:51 出处:网络
I am just trying to know a text editor works ( jquery ), I found many jquery text editors on web. My question,the开发者_C百科 editor itself is not a textarea but an iframe I think, but How the cursonr

I am just trying to know a text editor works ( jquery ), I found many jquery text editors on web. My question,the开发者_C百科 editor itself is not a textarea but an iframe I think, but How the cursonr blinks like a cursor in text area

please check this http://batiste.dosimple.ch/blog/posts/2007-09-11-1/rich-text-editor-jquery.html

If you have a url to how to make a text editor, please let me know


It seems to toggle a designMode property on the document object and sets it to "On" with this function:

function tryEnableDesignMode(iframe, doc, callback) {
    try {
        iframe.contentWindow.document.open();
        iframe.contentWindow.document.write(doc);
        iframe.contentWindow.document.close();
    } catch(error) {
        console.log(error)
    }
    if (document.contentEditable) {
        iframe.contentWindow.document.designMode = "On";
        callback();
        return true;
    }
    else if (document.designMode != null) {
        try {
            iframe.contentWindow.document.designMode = "on";
            callback();
            return true;
        } catch (error) {
            console.log(error)
        }
    }
    setTimeout(function(){tryEnableDesignMode(iframe, doc, callback)}, 250);
    return false;
}


What you are referring to is commonly called a WYSIWYG.

The basic of making a WYSIWYG is to have an iframe with the property designMode = true. Basicly this is how you can have the look and feel of a textarea, but with extra features available.

For further information, you can look at those tutorial :
- http://www.emirplicanic.com/javascript/cross-browser-textarea-editor.php
- https://developer.mozilla.org/en/Rich-Text_Editing_in_Mozilla
- http://msdn.microsoft.com/en-us/library/ms537834(VS.85).aspx

Or search on Google with the keyword "WYSIWYG javascript tutorial".

Related answers
- javascript Rich Text Editors

0

精彩评论

暂无评论...
验证码 换一张
取 消