2

CSS を使用して ::selection をターゲットにするhttp://jsfiddle.net/duhTB/を見ています。

今、私がやろうとしていることは少し異なります。我慢してください。

コードは次のとおりです: http://jsfiddle.net/Ywq2x/15/。#id_input-id'd テキスト領域に入力したテキストを強調表示して ctrl+b を押すと、強調表示されたテキストが #id_selected-id'd pre ブロックに出力されるようにしようとしています。

私が使用しているコードに問題がある場合は、それを示して、問題を修正する方法を教えてください。私がやろうとしていることが jQuery では不可能な場合、その理由を説明していただけますか? また、別の方法があれば説明していただけますか？

ありがとうございました。

利便性と永続的なパワーのために、問題のコードもここに投稿します。

JS/jquery

$(document).ready(function(e) {
    $("#id_input").keypress(function(e) {
        if(e.keyCode == 66 && e.ctrlKey) {    
            var val = $("#id_input::selection").val();
            $("#id_selected").text(val);
        }
    });
});

HTML:

<p>A1:</p>
<textarea rows="2" cols="30" class="txt_input_area dotted" id="id_input">
</textarea>
<div class="now_working">
  <pre id="id_selected"></pre>
</div>
4

1 に答える 1

3

::selectedセレクターは jQuery では機能しないようですが、入力フィールドとテキストエリアから選択したテキストを取得するための dwieeb によるjquery-textrange プラグインがあることは朗報です。

これを試して ：

$(function() {
    $("#id_input").on('keydown', function(e) {
        if (e.keyCode == 66 && e.ctrlKey) {
            e.preventDefault();//inhibit opening Opera's sidebar
        }
    }).on('keyup', function(e) {
        if (e.keyCode == 66 && e.ctrlKey) {
            var txt = $("#id_input").textrange('get', 'text');
            $("#id_output").text(txt);
        }
    });
});

ワーキングデモ

記録として、これらは jquery-textrange の全機能です:

  • ('get', 'position'): テキスト フィールド内のカーソル位置
  • ('get', 'start'): テキスト フィールド内の選択されたテキストの開始位置
  • ('get', 'end'): テキスト フィールド内の選択されたテキストの終了位置
  • ('get', 'length'): テキスト フィールドで選択されたテキストの長さ
  • ('get', 'text'): 選択されたテキスト
  • ('set'): フィールド内のすべてのテキストを選択します
  • ('set', n): n 番目の文字からテキストの末尾までを選択します
  • ('set', n, length): n 番目の文字から開始して、文字を選択lengthします (またはテキストの最後まで)
  • ('set', n, 0): ('setcursor', n) と同等
  • ('setcursor', n): テキスト フィールド内の指定された位置にカーソルを設定します。
  • ('replace', 'some text'): 選択したテキストを置き換えるか、カーソル位置に挿入します。

プラグインの最新の状態を反映するために 2014 年 2 月 28 日に改訂

Web プログラミングの最も厄介な側面であるテキスト範囲から苦痛を取り除くプラグインを提供してくれた dwieeb に感謝します。

于 2012-12-27T07:12:30.257 に答える