Question

我想知道是否可以确切地知道所选文本在dom中的位置？

我目前正在使用以下函数来了解正在选择的文本，但我希望能够返回其位置

Selector = {};
Selector.getSelected = function(){
  var t = '';
  if(window.getSelection){
    t = window.getSelection();
  }else if(document.getSelection){
    t = document.getSelection();
  }else if(document.selection){
    t = document.selection.createRange().text;
  }
  return t;
}

我也可以通过以下方式找到父元素：

function getSelectionStart(){
    var node = document.getSelection().anchorNode;
    var startNode = (node.nodeName == "#text" ? node.parentNode : node);
    return startNode;
}

但有没有办法让我知道js的字符位置取决于我点击的位置？

Answer 1

我最终动态地将每个字符作为单独的span标记和它的索引进行寻址。

这就是我现在正在做的事情。

$('#codeinput ul' || '#selectednote li .char').click( function() {
    if ($('#selectednote li *').size() < 2)
    {
    $('#codeinput h1').animate({opacity: '0.6'}, 200);
    inputtype = 1;
    inputnode = '#codeinput #selectednote li'
    console.log('focus is shifted to ' + inputnode)
    $('#codeinput #selectednote li').animate({opacity: '0.9'}, 200);
    }
    else
    {
    $('#selectednote li .char').click(function() {
    k = 0   
    $('#codeinput h1').animate({opacity: '0.6'}, 200);
    var char = $(this).attr('id')
    inputnode = char
    $('#caret').insertAfter('#selectednote li span:eq(' + (parseInt(inputnode) + parseInt(k)) + ')');
    inputtype = 2;
    console.log('clicked on ' + inputnode)
    $('#codeinput #selectednote li').animate({opacity: '0.9'}, 200);
    });
    };
});




function sendinputtodom(input,type) {
    $(".char").each(function(){ $(this).attr('id', $(this).index())});
if (inputtype == 2) {
    var from = '#selectednote li span:eq(' + (parseInt(inputnode) + parseInt(k)) + ')';
    console.log(from)
    $('<span class="char">' + input + '</span>').insertAfter(from);

    k = k + 1;

    $('#caret').insertAfter('#selectednote li span:eq(' + (parseInt(inputnode) + parseInt(k)) + ')');


    if($('#afterinput').size() < 1)
    {

    }
}
else
{
   $('<span class="char">' + input + '</span>').appendTo(inputnode);
}

$(".char").each(function(){ $(this).attr('id', $(this).index())});

};

它不优雅，干净或轻巧，但它可以完成工作。

获取dom中位置的特定文本选择

1 个答案: