jquery - 将文本框的高度设置为标签文本的高度

标签 jquery html css

有人可以给我提供一个示例,说明如何设置文本框的高度以适合其所附标签的高度吗?如您所见,我在字段集中有我的标签和文本框。我的标签文本可以是可变的,所以我不确定是否有 css 属性来处理这个或者它必须动态设置。我还应该提到,我的标签是在页面加载时即时填充的。我正在使用 Asp.net。

http://postimg.org/image/am7xxwr1v/

<fieldset class="input">
<ol>
        <li>
            <asp:Label id="label1" AssociatedControlID="textField1" runat="server">Provide a brief description of the process used to build, monitor and maintain investment portfolios for this strategy.</asp:Label>
            <textarea ID="textField1" runat="server" cols="40" rows="4"></textarea>
        </li>
        <li>
            <asp:Label id="label2" AssociatedControlID="textField2" runat="server">What market anomaly or inefficiency are you trying to capture?</asp:Label>          
            <textarea ID="textField2" runat="server" cols="40" rows="4"></textarea>
        </li>
</ol>
</fieldset>
fieldset.input
{
float:none;
clear:both;
width:97%;
border:1px solid #C0CED7;
padding:0;
}

fieldset.input ol 
{
list-style:none;
padding: 1em 1em 0;
}

fieldset.input li 
{
float:left;
clear:left;
width:100%;
padding-bottom:1em;
}

fieldset.input label 
{
float:left;
width:15em;
margin-right:3em;
text-align:left;
}

最佳答案

您可以使用 jQuery 来完成。

$(document).ready(function() {
   var labelHeight = $('label').height();
   $('textarea').height(labelHeight);
});

这是 JSFiddle 示例 - http://jsfiddle.net/XrcLy/1/

关于jquery - 将文本框的高度设置为标签文本的高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16065602/

相关文章:

html - div 容器上的背景颜色不随页面滚动

html - 需要在网站的一个部分更改字体大小

javascript - 如何在浏览器缩放时动态定位和缩放 iframe

javascript - 如何格式化 Highcharts 的 (x,y) 对数据的日期时间

jquery - '$("#foo")' and ' jQuery ("#foo")' 之间的区别

javascript - 如何将数据从模态传递到函数

html - 用于 html 的 Perl 正则表达式

javascript - 如何使用名称属性克隆新的字段组并增加名称属性

html - CSS3 动画不适用于非 webkit 浏览器

jquery - 检查多个 DOM 值