1

次のことを達成するにはどうすればよいですか?

開始時: タイトルを強調表示 Tab キーを押す: 説明を強調表示する Tab キーを押す: コンテンツを強調表示する

[1 枚目の画像] 開始時: タイトルを強調表示

【画像2枚目】Tabキーを押す:説明を強調表示

[画像 3 枚目] Tab キーを押す: コンテンツを強調表示する

もう一度 Tab キーを押す タイトルをハイライト表示するために戻り、次に進みます

以下はtinymceの内容です:

    <hr>
    <div id='title'>
        TITLE
    </div>
    <hr>
    <div id='description'>
        DESCRIPTION
    </div>
    <hr>
    <div id='content'>
        CONTENT
    </div>

以下は、テキストを選択する現在の機能です。

    // the problem is that it doesn't select the text but put the carret in the first part of the text
    // looks like this (|*carret) --> |TITLE or |DESCRIPTION or |CONTENT
    // id = #title, #description, #content
    tinyMceSelectText = function (id) {
            if ($('#id_of_tinymce_iframe').contents().find(id).length > 0) {
            var $itemNode = $('#content_editor_ifr').contents().find(id);
            var text = '';
            var items = $itemNode.contents();
            // clean up the span and other elements automatically inserted by tinymce
            $.each(items, function (i, val) {
                if ($(val).length == 0) {
                    return;
                }
                if ($(val).prop('nodeName') == 'BR') {
                        text += '<br/>';
                } else {
                    var t = $(val).text();
                    text += t;
                }
            })
            $itemNode.html(text);
            var len = $itemNode.contents().length - 1;
            var textNode = $itemNode.contents()[len];
            start = (start === undefined) ? 0 : start;    
            end = (end === undefined) ? textNode.length : end;

            var ed = tinyMCE.activeEditor;
            var range = ed.selection.getRng(true);

            start = (start === undefined)? 0 : start;
            end = (start === undefined)? 0 : end;

            try {
                range.setStart(textNode, start);
                range.setEnd(textNode, end);
                range.collapse(true);
                ed.selection.setRng(range);
                //ed.selection.collapse(false); // added to put carret to the last part of the text
                var items = $itemNode.contents();
            } catch (err) {}
        }
    }
4

0 に答える 0