преобразовать текстовое поле в многострочное с помощью jquery

Question

У меня есть однострочное текстовое поле.

Я хочу с помощью jquery преобразовать его в многострочное, но контролировать, сколько строк добавлено в него.Я также хочу иметь возможность ограничить количество символов в каждой строке.

Есть идеи, как мне это сделать с помощью jquery?

РЕДАКТИРОВАТЬ:

Да, что я имел в видупо текстовому полю было <input type="text">

EG.<input type="text" value="" name="txtTextBox1" id="xtTextBox1">

Answer 1

Учитывая, что у вас есть следующий HTML:

<input type="text" class="myclasses" style="color: #123123" value="akira"/> 

затем используя следующий фрагмент:

(function($) {
    $.fn.changeToTextArea = function(rows, columns) {
        var attrs = {};
        var text = "";

        $.each(this[0].attributes, function(idx, attr) {
            attrs[attr.nodeName] = attr.nodeValue;
            if(attr.nodeName == "value") {
              text = attr.nodeValue;
              }
            attrs["rows"] = rows;
            attrs["cols"] = columns;
        });

        this.replaceWith(function() {
            return $("<textarea/>", attrs).append($(this).contents()).html(text);
        });
    }
})(jQuery);

Вы должны позвонить с

$("input").changeToTextArea(7, 25);

(function($) {
    $.fn.changeToTextArea = function(rows, columns) {
        var attrs = {};
        var text = "";
      
        $.each(this[0].attributes, function(idx, attr) {
            attrs[attr.nodeName] = attr.nodeValue;
            if(attr.nodeName == "value") {
              text = attr.nodeValue;
              }
            attrs["rows"] = rows;
            attrs["cols"] = columns;
        });

        this.replaceWith(function() {
            return $("<textarea/>", attrs).append($(this).contents()).html(text);
        });
    }
})(jQuery);


$("input").changeToTextArea(7, 25);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<input type="text" class="xyzxterms" style="color: #123131" value="akira"/>