我正在尝试创建一个动态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/
答案 0 :(得分:1)
$("#Message_txt").keyup(function (e) {
if (e.which == 13) {
ResizeTextArea();
}
});
在op的评论后更新
function isOverflowed(element) {
return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
}
$("#Message_txt").keyup(function (e) {
if (isOverflowed(this)) {
ResizeTextArea();
}
});