在keydown上点击textarea /点击

Question

我的textarea顶部有一个标签。

当某人在textarea上点击或 keydown 时，我试图让文字转到标签的边缘，所以它看起来就像是textarea开始的地方。

我现在所拥有的是找到标签的宽度，然后在文本区域的开头添加适当数量的空格。

Firefox和Safari非常接近标签。但是铬增加了一些额外的空间。

有人能帮我找出更合适的方法吗？

http://jsfiddle.net/3jGv7/2/

function cursorPosition(data) {
    var labelWidth = $(data).siblings('[class=indent]').width(),
        spaces = Math.round(labelWidth / 3.6) + 1,
        sVar = "";
    for (var x = 1; x <= spaces; x++) {
        sVar += " ";
    }
    if (!data.value.match(/^[ ]{'+spaces+'}/)) {
        data.value = sVar + data.value.replace(/^\s+/, "");
    }
    if (data.selectionStart < spaces) {
        data.selectionStart = spaces;
    }
}

Answer 1

您可以使用CSS：

text-indent: 165px;

jsFiddle Demo

如果你想要一个jQuery版本：

var indentWidth = $('textarea.indent').prev('div.indent').width();
$('textarea.indent').css('text-indent', indentWidth+'px');

jsFiddle Demo