javascript - How to insert textsymbols from a custom button on textAngular toolbar - Stack Overflow

admin管理员组

文章数量:1400591

Essentially I want to add a button to the toolbar to allow the user to insert © into the textangular editor (/), however I am having trouble understanding how to add functionality to my button after it has been registered... As all the examples for custom functionality on the textangular site use the same statement "wrapSelection" which has very minimal documentation, an example of this is shown below with the quote button.

    taRegisterTool('quote', {
    iconclass: 'fa fa-quote-right',
    tooltiptext: taTranslations.quote.tooltip,
    action: function(){
        return this.$editor().wrapSelection("formatBlock", "<BLOCKQUOTE>");
    },
    activeState: function(){ return this.$editor().queryFormatBlockState('blockquote'); }
});

I am confused as to where the "formatBlock" is initialised and believe finding its source would help me with this problem. As you can see any help would be appreciated

    taRegisterTool('insertCopyright', {
        buttontext: '©',
        tooltiptext: taTranslations.insertCopyright.tooltip,
        action: function () {
            //???
       },
    });

Essentially I want to add a button to the toolbar to allow the user to insert © into the textangular editor (http://textangular./), however I am having trouble understanding how to add functionality to my button after it has been registered... As all the examples for custom functionality on the textangular site use the same statement "wrapSelection" which has very minimal documentation, an example of this is shown below with the quote button.

    taRegisterTool('quote', {
    iconclass: 'fa fa-quote-right',
    tooltiptext: taTranslations.quote.tooltip,
    action: function(){
        return this.$editor().wrapSelection("formatBlock", "<BLOCKQUOTE>");
    },
    activeState: function(){ return this.$editor().queryFormatBlockState('blockquote'); }
});

I am confused as to where the "formatBlock" is initialised and believe finding its source would help me with this problem. As you can see any help would be appreciated

    taRegisterTool('insertCopyright', {
        buttontext: '©',
        tooltiptext: taTranslations.insertCopyright.tooltip,
        action: function () {
            //???
       },
    });

• javascript
• jquery
• angularjs
• angular-ui

Share Improve this question Follow edited Oct 8, 2014 at 8:18 asked Oct 1, 2014 at 15:54 user4079725user4079725 1

• I'll take a note about the wrapSelection poor docs - It's basically a wrapper for execCommand but we fix some of the inconsistent calls. – Simeon Cheeseman Commented Oct 7, 2014 at 21:18

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

Just thought I would post our workaround answer for anyone wishing to insert custom symbols or anything like that, obviously we can move the 'insertTextAtCursor' and 'moveCaret' elsewhere to cleanup but regardless..

    taRegisterTool('insertCopyright', {
            buttontext: '©',
            tooltiptext: taTranslations.insertCopyright.tooltip,
            action: function() {
                function insertTextAtCursor(text) {
                    var sel, range;
                    if (window.getSelection) {
                        sel = window.getSelection();
                        if (sel.getRangeAt && sel.rangeCount) {
                            range = sel.getRangeAt(0);
                            range.deleteContents();
                            range.insertNode(document.createTextNode(text));
                        }
                    } else if (document.selection && document.selection.createRange) {
                        document.selection.createRange().text = text;
                    }
                }

                function moveCaret(charCount) {
                    var sel, range;
                    if (window.getSelection) {
                        sel = window.getSelection();
                        if (sel.rangeCount > 0) {
                            var textNode = sel.focusNode;
                            sel.collapse(textNode.nextSibling, charCount);
                        }
                    } else if ((sel = window.document.selection)) {
                        if (sel.type != "Control") {
                            range = sel.createRange();
                            range.move("character", charCount);
                            range.select();
                        }
                    }
                }

                insertTextAtCursor(String.fromCharCode(169));
                return moveCaret(1);
            },
        });

本文标签： javascriptHow to insert textsymbols from a custom button on textAngular toolbarStack Overflow