使用jquery在38个字符后强制在textarea中换行

时间:2014-02-25 21:23:00

标签: javascript

1 Heres是我的代码,但我不知道如何添加换行符并允许用户继续输入。警报消息很好但我只是希望用户继续输入脚本并添加换行符。

dom.query = jQuery.noConflict( true );
dom.query(document).ready(function() {
    // var myTA = dom.query('#remaining_chars');
    //alert(myTA[0].scrollHeight); 
    dom.query('#ta').keypress(function() {
        var text =dom.query(this).val();
        var arr = text.split("\n");
        for(var i = 0; i < arr.length; i++) {
            if(arr[i].length > 38) {
                alert("Not more than 38 characters per line! Continue in next line!");
                event.preventDefault(); // prevent characters from appearing
            }
        }

        console.log(text);
        dom.query('#ta').val(text);
    });
});

链接到代码:http://jsfiddle.net/e5w5z/8/ 1

1 个答案:

答案 0 :(得分:1)

如果用户继续输入并且从不回溯,此代码将自动插入换行符。这只分析了textarea中的最后一行。因此,如果他们返回上一行并开始编辑,他们将能够键入超过每行允许的最大字符数。应该可以对每一行进行分析,但是你必须编写一些更复杂的逻辑,以便在正确的位置插入换行符并在更改textarea内容后正确设置插入位置。

JSFiddle:http://jsfiddle.net/7V3kY/1/

var LINE_LENGTH_CHARS = 38;

$(function(){

    $(document).on('input propertychange','textarea',function(e){
        // Something was typed into the textarea
        var lines = $(this).val().split("\n");
        var last_line = lines[lines.length-1];
            if (last_line.length >= LINE_LENGTH_CHARS) {

                // Resetting the textarea val() in this way has the 
                // effect of adding a line break at the end of the 
                // textarea and putting the caret position at the 
                // end of the textarea
                $(this).val($(this).val()+"\n");

            }
    });
});