防止<标签></标签>调整大小

Prevent <label></label> from resizing

本文关键字:标签 防止 调整      更新时间:2023-09-26

我有一个DIV元素,里面有一个<label></label>和输入文本框。

基本上,我已经在 DIV 元素上启用了 jQuery .ressizeable(),但是当您使 DIV 元素小于当前时,文本框会被推到新行上。

如何强制<label>永远不会小于设定的大小?

谢谢!

<div id='div1' style='width:300px'>
    <label>Test&nbsp;
        <input type='text' style='width:100px' id='inputBox'/>
    </label>
</div>
$("#div1").resizable({
    handles: "e, w, sw, ne, nw, se"
});

给它一个min-width

<div id='div1' style='width: 300px; min-width: 300px;'>

或者,最好是:

#div1 {
    min-width: 300px;
    width: 300px;
}

jQuery UI的可调整大小有一个minWidth属性(文档中的示例):

$( "#resizable" ).resizable({
      maxHeight: 250,
      maxWidth: 350,
      minHeight: 150,
      minWidth: 200
});

因此,您可以将 maxWidthProperty 设置为 $("label").width()