Question

嗨大家[和女孩]：）

只是想知道是否可以在div中获得角色的absolute位置？

<div class="mycooldiv">
    bunch of text is in here and for example some # and some other cool #
</div>

即。或许或以其他方式使用jQuery UI Position - 我如何获得#的位置？

Answer 1

如果元素只包含文本，则可以将该字符包装在内联元素中，并使用.offset()获取元素的位置。然后，放回原始文本。 小提琴：http://jsfiddle.net/Dp6JR/

var $elem = $('.mycooldiv');
var text = $elem.html();
var newText = text.replace(/#/, '<span class="get-position-of-it"></span>');
$elem.html(newText); //Set wrapper
var offset = $(".get-position-of-it").offset();
$elem.html(text)    ; //Place back
var topPos = offset.top;
var left = offset.left;

注意：此函数获取第一个找到的#字符的位置。如果您想获取所有字符的位置，请将g添加到正则表达式(/#/g）。

获得所有职位 - 小提琴：http://jsfiddle.net/Dp6JR/1/

所有字符的偏移量将存储在二维数组（矩阵）中。

var positions = [];
var $elem = $('.mycooldiv');
var text = $elem.html();
var newText = text.replace(/#/g, '<span class="get-position-of-it"></span>');
$elem.html(newText); //Set wrapper
$(".get-position-of-it").each(function(){
    var offset = $(this).offset();
    positions.push([offset.left, offset.top]);
});
$elem.html(text)    ; //Place back
//`positions` is an array of all offset information

输出可以等同于：

var positions = [
    [0, 0],
    [100, 0]
];

Answer 2

您可以使用lettering.js插件，该插件包含span元素中的字母（或字或行）。

通过这种方式，您可以轻松定位它们，并在这些元素上使用.position()来获取其容器中的实际位置（应该有position:relative ）..

http://jsfiddle.net/gaby/G7hFB/

演示

Answer 3

你的立场是什么意思？文本字符串中的位置或其容器边界内的坐标（x，y）？

如果是第一种情况，您可以使用.idexOf()方法，在第二种情况下，我会将该元素包装在span标记中，然后获取其位置。

jQuery在Div中获得角色的位置？

3 个答案: