在textarea中找到包含ARABIC文字的"换行符"

Question

我有一个文本字符串,我以textarea(从右到左的方向)显示.用户可以动态调整textarea的大小(我使用jquery),文本将根据需要进行换行.

当用户点击提交时,我将使用该文本并使用PHP创建图像,但在提交之前我想知道"换行符"或更确切地说是"自动换行"的位置.

我到目前为止看到的每个地方只向我展示了如何在php端处理换行符.我想明确表示没有线路突破.我所拥有的是一个LONG字符串,它将根据用户设置的textarea的宽度以不同的方式进行自动换行.

我不能使用"列"或任何其他标准宽度表示,因为我有一个非常复杂的阿拉伯字体,实际上由许多不同宽度的字形(字符)组成.

如果有人知道访问单词包装的方式(在textarea或div中,如果需要),我真的很想知道.

我唯一的另一个解决方案是实际存储(在我的数据库中)每个字符的宽度(有点单调乏味,因为600种不同的字体有超过200个字符,总共......一些巨大的数字).

我的希望并不高,但我想我会问.

谢谢

一世.贾马尔

Answer 1

好吧,不是找到换行符(这几乎是不可能的),你可以使用这个函数强制它们进入textarea:

function ApplyLineBreaks(strTextAreaId) {
    var oTextarea = document.getElementById(strTextAreaId);
    if (oTextarea.wrap) {
        oTextarea.setAttribute("wrap", "off");
    }
    else {
        oTextarea.setAttribute("wrap", "off");
        var newArea = oTextarea.cloneNode(true);
        newArea.value = oTextarea.value;
        oTextarea.parentNode.replaceChild(newArea, oTextarea);
        oTextarea = newArea;
    }

    var strRawValue = oTextarea.value;
    oTextarea.value = "";
    var nEmptyWidth = oTextarea.scrollWidth;
    var nLastWrappingIndex = -1;
    for (var i = 0; i < strRawValue.length; i++) {
        var curChar = strRawValue.charAt(i);
        if (curChar == ' ' || curChar == '-' || curChar == '+')
            nLastWrappingIndex = i;
        oTextarea.value += curChar;
        if (oTextarea.scrollWidth > nEmptyWidth) {
            var buffer = "";
            if (nLastWrappingIndex >= 0) {
                for (var j = nLastWrappingIndex + 1; j < i; j++)
                    buffer += strRawValue.charAt(j);
                nLastWrappingIndex = -1;
            }
            buffer += curChar;
            oTextarea.value = oTextarea.value.substr(0, oTextarea.value.length - buffer.length);
            oTextarea.value += "\n" + buffer;
        }
    }
    oTextarea.setAttribute("wrap", "");
}

此函数获取textarea的ID,并且每当有自动换行时,它会将新的换行符推入textarea.在表单提交中运行该函数,您将在服务器端代码中获得包含正确换行符的文本.

成功测试IE,Chrome和Firefox可以在这里自由查看:http://jsfiddle.net/yahavbr/pH79a/1/(预览将显示新行)

Answer 2

这是Shadow Wizard的解决方案的功能等效实现,它更快,因为它使用二进制搜索而不是线性搜索来确定每行的长度:

function ApplyLineBreaks(strTextAreaId) {
    var oTextarea = document.getElementById(strTextAreaId);
    if (oTextarea.wrap) {
        oTextarea.setAttribute("wrap", "off");
    }
    else {
        oTextarea.setAttribute("wrap", "off");
        var newArea = oTextarea.cloneNode(true);
        newArea.value = oTextarea.value;
        oTextarea.parentNode.replaceChild(newArea, oTextarea);
        oTextarea = newArea;
    }

    var strRawValue = oTextarea.value;
    oTextarea.value = "";
    var nEmptyWidth = oTextarea.scrollWidth;

    function testBreak(strTest) {
        oTextarea.value = strTest;
        return oTextarea.scrollWidth > nEmptyWidth;
    }
    function findNextBreakLength(strSource, nLeft, nRight) {
        var nCurrent;
        if(typeof(nLeft) == 'undefined') {
            nLeft = 0;
            nRight = -1;
            nCurrent = 64;
        }
        else {
            if (nRight == -1)
                nCurrent = nLeft * 2;
            else if (nRight - nLeft <= 1)
                return Math.max(2, nRight);
            else
                nCurrent = nLeft + (nRight - nLeft) / 2;
        }
        var strTest = strSource.substr(0, nCurrent);
        var bLonger = testBreak(strTest);
        if(bLonger)
            nRight = nCurrent;
        else
        {
            if(nCurrent >= strSource.length)
                return null;
            nLeft = nCurrent;
        }
        return findNextBreakLength(strSource, nLeft, nRight);
    }

    var i = 0, j;
    var strNewValue = "";
    while (i < strRawValue.length) {
        var breakOffset = findNextBreakLength(strRawValue.substr(i));
        if (breakOffset === null) {
            strNewValue += strRawValue.substr(i);
            break;
        }
        var nLineLength = breakOffset - 1;
        for (j = nLineLength - 1; j >= 0; j--) {
            var curChar = strRawValue.charAt(i + j);
            if (curChar == ' ' || curChar == '-' || curChar == '+') {
                nLineLength = j + 1;
                break;
            }
        }
        strNewValue += strRawValue.substr(i, nLineLength) + "\n";
        i += nLineLength;
    }
    oTextarea.value = strNewValue;
    oTextarea.setAttribute("wrap", "");
}

更新了小提琴.