2

我正在查看http://jsfiddle.net/duhTB/，它使用 CSS 来定位 ::selection。

现在，我想做的有点不同。忍受我。

这是代码：http: //jsfiddle.net/Ywq2x/15/。我正在尝试这样做，以便当我突出显示已输入到#id_input-id'd 文本区域的文本并按 ctrl+b 时，突出显示的文本将输出到 #id_selected-id'd 预块。

如果您发现我正在使用的代码有任何问题，请指出它们并告诉我如何纠正这些问题？如果我想要做的事情对 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 日修订以反映插件的最新状态

感谢 dwieeb 提供了一个插件，它消除了 Web 编程中最令人作呕的方面——文本范围——的痛苦。

于 2012-12-27T07:12:30.257 回答