有没有办法使用jQuery得到一个块内容的第5行(它的第一个字母的偏移量)?
我的意思是视觉线,浏览器计算线,而不是源代码中的线.
解决方法:
jQuery.fn.line:
jQuery.fn.line = function(line) {
var dummy = this.clone().css({
top: -9999,
left: -9999,
position: 'absolute',
width: this.width()
}).appendTo(this.parent()),
text = dummy.text().match(/\S+\s+/g);
var words = text.length,
lastTopOffset = 0,
lineNumber = 0,
ret = '',
found = false;
for (var i = 0; i < words; ++i) {
dummy.html(
text.slice(0,i).join('') +
text[i].replace(/(\S)/, '$1<span/>') +
text.slice(i+1).join('')
);
var topOffset = jQuery('span', dummy).offset().top;
if (topOffset !== lastTopOffset) {
lineNumber += 1;
}
lastTopOffset = topOffset;
if (lineNumber === line) {
found = true;
ret += text[i];
} else {
if (found) {
break;
}
}
}
dummy.remove();
return ret;
};
用法:
$('#someParagraph').line(3); // blah blah blah
这个怎么运作:
它遍历插入< span />的整个元素(实际上是元素的克隆).每个单词中的元素.跨度的顶部偏移量被缓存 – 当此偏移量发生变化时,我们可以假设我们处于新线上.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。