javascript - Tinymceエディタでテキストを選択する

Question

ウェブサイトに検索機能を追加しようとしています。Tinymce Editorでコンテンツを検索し、一致するものが見つかった場合はそれらを選択します。

一致する場合、どのようにテキストを選択できますか。誰か知っている場合は返信してください

Answer 1

これはそれほど難しいことではありません。最も簡単なのは、searchreplaceプラグインのsearchNext関数を確認することです（以下にコードを追加します）。

プラグインコードは小さなポップアップコンテキストで実行されるため、少し調整する必要があります。関数を機能させるために事前に設定する必要がある変数は次のとおりです。

var ed = tinymce.get('your_editor_id');
var se = ed.selection;
var r = se.getRng();
// var m = this.lastMode; // not needed here
var fl = 0;
var w = ed.getWin();
var wm = ed.windowManager;
var fo = 0;
//var f = document.forms[0];  //not needed here (plugin relevant)
var s = 'word_to_be_searched_for';
var b = 0; // direction of the search (forward=0, backward = 1)
var ca = 0; // casesensitiviy of the search (not casesensitive = 0, casesensitive = 1)
var rs = ''; // possibility to use a string to replace found text

関数は次のとおりです。

searchNext : function(a) {
    var ed = tinyMCEPopup.editor, se = ed.selection, r = se.getRng(), f, m = this.lastMode, s, b, fl = 0, w = ed.getWin(), wm = ed.windowManager, fo = 0, err = 0;

    // Get input
    f = document.forms[0];
    s = f[m + '_panel_searchstring'].value;
    b = f[m + '_panel_backwardsu'].checked;
    ca = f[m + '_panel_casesensitivebox'].checked;
    rs = f['replace_panel_replacestring'].value;

    if (tinymce.isIE) {
        r = ed.getDoc().selection.createRange();
    }

    if (s == '')
        return;

    function fix() {
        // Correct Firefox graphics glitches
        // TODO: Verify if this is actually needed any more, maybe it was for very old FF versions? 
        r = se.getRng().cloneRange();
        ed.getDoc().execCommand('SelectAll', false, null);
        se.setRng(r);
    };

    function replace() {
        ed.selection.setContent(rs); // Needs to be duplicated due to selection bug in IE
    };

    // IE flags
    if (ca)
        fl = fl | 4;

    switch (a) {
        case 'all':
            // Move caret to beginning of text
            ed.execCommand('SelectAll');
            ed.selection.collapse(true);

            if (tinymce.isIE) {
                ed.focus();
                r = ed.getDoc().selection.createRange();

                while (r.findText(s, b ? 1 : 1, fl)) {
                    r.scrollIntoView();
                    r.select();
                    replace();
                    fo = 1;

                    if (b) {
                        r.moveEnd("character", -(rs.length)); // Otherwise will loop forever
                    }
                }

                tinyMCEPopup.storeSelection();
            } else {
                while (w.find(s, ca, b ? 0 : 0, false, false, false, false)) {
                    replace();
                    fo = 1;
                }
            }

            if (fo)
                tinyMCEPopup.alert(ed.getLang('searchreplace_dlg.allreplaced'));
            else
                tinyMCEPopup.alert(ed.getLang('searchreplace_dlg.notfound'));

            return;

        case 'current':
            if (!ed.selection.isCollapsed())
                replace();

            break;
    }

    se.collapse(b);
    r = se.getRng();

    // Whats the point
    if (!s)
        return;

    if (tinymce.isIE) {
        ed.focus();
        r = ed.getDoc().selection.createRange();

        if (r.findText(s, b ? -1 : 1, fl)) {
            r.scrollIntoView();
            r.select();
        } else
        {
            err = 1;
            tinyMCEPopup.alert(ed.getLang('searchreplace_dlg.notfound'));
        }
        tinyMCEPopup.storeSelection();
    } else {
        if (!w.find(s, ca, b, false, false, false, false))
        {
            err = 1;
            tinyMCEPopup.alert(ed.getLang('searchreplace_dlg.notfound'));
        }
        else
            fix();
    }

    // Focus input field if search yieled no error
    if (!err && !tinymce.isIE) {
        f[m + '_panel_searchstring'].focus();
    }
}