在jQuery中创建动态textarea

时间:2013-08-31 07:18:12

标签: javascript jquery

我正在尝试创建一个动态textarea,但我不知道如何修复keyup操作,所以resize函数只有在存在/ n时才能工作

脚本:

function ResizeTextArea() {

        var msgTxtHeight = $("#<%=Message_txt.ClientID %>").css("height");

        var containerDivHeight = $(".MsgDiv").css("max-height");


        if ($("#<%=Message_txt.ClientID %>").val() == "") {
            $("#<%=ConversationDIv.ClientID %>").css("height", "318px");
            $("#<%=Message_txt.ClientID %>").css("height","15px");
        }
         if (msgTxtHeight >= containerDivHeight) { return false; }
          $("#<%=Message_txt.ClientID %>").css("height", $("#<%=Message_txt.ClientID  %>").height() + 15);
           $("#<%=ConversationDIv.ClientID %>").height($("#<%=ConversationDIv.ClientID %>").height() - 15);

    } 

HTML:

  <div id="ConversationDIv" runat="server" clientidmode="Static" style="height: 318px;
    width: 100%; overflow: auto;" class='convoDiv'>
</div>
<table border="0" width="100%">
    <tr>
        <td align="left" style="width: 91%">
        <div class="MsgDiv">
          <asp:TextBox ID="Message_txt" runat="server" Width="100%"   TextMode="MultiLine" CssClass="Messagetxt" onkeyup="ResizeTextArea();"></asp:TextBox>
          </div>
        </td>
     </tr></table>

的jsfiddle:http://jsfiddle.net/49HQM/195/

1 个答案:

答案 0 :(得分:1)

DEMO

$("#Message_txt").keyup(function (e) {
        if (e.which == 13) {
            ResizeTextArea();
        }
    });

e.which

在op的评论后

更新

DEMO

    function isOverflowed(element) {
        return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
    }
 $("#Message_txt").keyup(function (e) {
        if (isOverflowed(this)) {
            ResizeTextArea();
        }
    });