javascript - 在按下键/单击时缩进文本区域

Question

我的 textarea 上方有一个标签。

当有人点击 或 keydown 在文本区域上时，我试图让文本转到标签的边缘，这样它看起来就像是文本区域开始的地方。

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

Firefox 和 Safari 的标签非常接近。但是 chrome 添加了一些额外的空格。

谁能帮我想出一个更合适的方法？

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