2

私のフォーム id="Fulltext" の textarea は、本の多くの章を持つデータベースから供給されます。ユーザーがテキスト領域の上のリンクをクリックする
<a href="samePage.php?chap=Chapter 5" id="Chapter 5">Chapter 5</a>と、カーソルがテキスト領域内に移動し、テキスト「第 5 章」の前に移動します。これは可能ですか？

4

2 に答える 2

3

デモ: http://jsfiddle.net/deg6j/

HTML

<html>
<head>
    <script type="text/javascript">
        function selectText(text)
        {
            var textArea = $('#Fulltext');
            var index = textArea.text().search(text);
            textArea.caretTo(index);      
        }
    </script>
</head>
<body>
<textarea id='Fulltext' rows=10>
    Chapter 1
    This is a lot of text...

    Chapter 2
    More more more

    Chapter 3
    More dsa less
</textarea>
    <a href="#" onclick="selectText('Chapter 2')">Chapter 2</a>
</body>
</html>

Javascript

new function($) {
  // Behind the scenes method deals with browser
    // idiosyncrasies and such
    $.caretTo = function (el, index) {
        if (el.createTextRange) { 
            var range = el.createTextRange(); 
            range.move("character", index); 
            range.select(); 
        } else if (el.selectionStart != null) { 
            el.focus(); 
            el.setSelectionRange(index, index); 
        }
    };

    // The following methods are queued under fx for more
    // flexibility when combining with $.fn.delay() and
    // jQuery effects.

    // Set caret to a particular index
    $.fn.caretTo = function (index, offset) {
        return this.queue(function (next) {
            if (isNaN(index)) {
                var i = $(this).val().indexOf(index);

                if (offset === true) {
                    i += index.length;
                } else if (offset) {
                    i += offset;
                }

                $.caretTo(this, i);
            } else {
                $.caretTo(this, index);
            }

            next();
        });
    };
}(jQuery);
于 2013-01-23T19:34:33.640 に答える
1

できると思います。

章が始まる場所をテキストで識別できると仮定すると、jQuery caret pluginで識別できます。

thisおよびthis questionの回答を確認してください。

さらに、チャプター アンカーで JavaScript 関数をバインドすることもできます。

于 2013-01-23T19:34:58.040 に答える