0

私がやろうとしているのは、名前がわからないかもしれませんが、テキストエリア内の予測ヘルプ入力者です。jquery オートコンプリートを使用しています。ユーザーが textarea (id=test) 内で '[[g ' と入力すると、オートコンプリート付きの入力 (id=example) が開かれるため、'data' で検索します。ユーザーが目的のデータを見つけたら、Shift+Enter を押してデータをテキストエリアに挿入し、']]' で閉じる必要があります。

入力をその近くに表示するキャレットの位置を見つけるにはどうすればよいですか?

私はキャレットのインデックスを見つけたくありませんが、xy絶対位置のようなものです。

あなたは私に何を提案しますか？

上記のコード:

<textarea onkeydown="predicao(this);" cols="40" rows="10" id="test" onfocus="this.focus()"></textarea>
<input id="example" style="display: none;" onkeyup="insert(this, event);"/>

<script language="Javascript">
<!--

function predicao(objeto){
    comprimento = objeto.value.length;
    var antipenultimo = comprimento - 4;
    var input = objeto.value.substring(antipenultimo,comprimento);
    var output = "";
    for(i=0; i<input.length; ++i){
        if(output != "") output += ", ";
        output += input.charCodeAt(i);
    }
    if (output == "91, 91, 103, 32"){

        var preditor = document.getElementById('example');
        preditor.value = '';
        preditor.style.display = 'block';
        preditor.focus();
        preditor.select();
    }  
}
function insert(objeto, evt){
    var e = evt || event;
    var code = e.keyCode || e.which;
    if(e.shiftKey && code == '13') {
        var texto = document.getElementById('test').value;
        texto += objeto.value+']]';
        document.getElementById('test').focus();
        document.getElementById('test').value = texto;
        objeto.style.display = 'none';
    }
}

$(document).ready(function(){
    var data = "Afrikaans Català Deutsch English Esperanto Suomi Français Galego Hrvatski Magyar Bahasa Indonesia Italiano Basa Jawa".split(" ");
$("#example").autocomplete(data);});
</script>
4

2 に答える 2

0

何かのようなもの：

var pos = $('textarea').caret(); // using caret plugin...
var lines = $('textarea').val().slice(0, pos).replace(/\t/g, '    ').split('\n');
var y = lines.length;
var x = lines[y-1].length;

固定幅フォントの場合、かなりうまく機能するはずです。

于 2011-08-13T16:58:05.233 に答える
0

JS のみを使用する場合:

function doGetCaretPosition (ctrl) {
    var CaretPos = 0;   // IE Support
    if (document.selection) {
    ctrl.focus ();
        var Sel = document.selection.createRange ();
        Sel.moveStart ('character', -ctrl.value.length);
        CaretPos = Sel.text.length;
    }
    // Firefox support
    else if (ctrl.selectionStart || ctrl.selectionStart == '0')
        CaretPos = ctrl.selectionStart;
    return (CaretPos);
}

提供: http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/
デモ: http://demo.vishalon.net/getset.htm

于 2011-08-13T17:11:27.190 に答える