在编辑时向textarea输入添加新行 [英] add new row to textarea input while editing

问题描述

我不知道如何在编辑时添加新的行/行到textarea，这是当字母数超过textarea的列数时自动添加新行。 >解决方案

一些基本的代码来实现这一点，在这个jsfiddle中测试过（ http：// jsfiddle达网络/ NZbZn / ）。它显然需要工作，但显示了基本概念。

  jQuery（document）.ready（function（）{
 
 //输入后发生
 jQuery（'textarea＃expander'）。keyup（function（）{
 
 //找出有多少个字符
 var长度= jQuery（this）.val（）。length; 
 
 // if more than 10 
 if（length> 10）{
 
 // if长度的模数10为零，有10个字符的倍数，所以我们需要延长一行
 //（注意显而易见的问题 - 在删除字符的同时它会扩展！）
如果（（长度％10）== 0）{
 
 //找出行数，递增1，并重置行attrib 
 var rows = jQuery（this）.attr （'rows'）; 
 rows ++; 
 
 jQuery（this）.attr（'rows'，rows）; 
} 
} 
}） ; 
}）; 
  

同样，首先考虑UI的含义。

I wonder how to add new row/line to textarea while editing that is when the number of letters exceeds number of cols of the textarea add new line automatically.

解决方案

Some basic code to achieve this, tested in this jsfiddle (http://jsfiddle.net/NZbZn/). It will need work, obviously, but shows the basic concept.

jQuery(document).ready(function(){

    //after typing occurs
    jQuery('textarea#expander').keyup(function(){

        //figure out how many chars
        var length = jQuery(this).val().length;

        //if more than 10
        if(length > 10){

            //if the modulus 10 of the length is zero, there are a multiple of 10 chars, so we need to extend by a row
            //(NOTE the obvious problem - this will expand while deleting chars too!)
            if((length % 10) == 0){

                //figure out the number of rows, increment by one, and reset rows attrib
                var rows = jQuery(this).attr('rows');
                rows++;

                jQuery(this).attr('rows', rows);    
            }  
        }   
    });    
});

Again though, consider the UI implications first.

这篇关于在编辑时向textarea输入添加新行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！