代码之家 › 专栏 › 技术社区 › T.P.

jQueryUI大小可调整的Textarea在切换后保留尺寸

jquery-ui html jquery

T.P. · 技术社区 · 14 年前

下面是一个示例代码测试工具,它模拟了我遇到的问题。基本上,当不对textarea使用resizable()时,单击“Content[+/-]”可以折叠字段集,并且不显示textarea。但是,当使用可调整大小时,单击“Content[+/-]”将隐藏文本区域,但文本区域的原始尺寸将保留,字段集不会折叠,并且调整大小图标仍显示在右下角。

有没有更好的方法来构造HTML或者我缺少jQuery/jQueryUI的操作?


<!DOCTYPE html>
<html>
<head><title>SO,2</title>
<script 
  type="text/javascript" 
  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script 
  type="text/javascript"
  src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js">
</script>
<link 
  rel="stylesheet" 
  type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/jquery-ui.css"/>
</head>
<body>

<div id="squish1">
  <fieldset id="fs1">
    <legend id="lg1">Content [+/-]</legend>
    <textarea rows="10" cols="80" name="ta1" id="ta1"></textarea>
  </fieldset>
</div>

<script type="text/javascript">
$('#ta1').resizable();
$('#fs1').click(function(){
  $('#ta1').toggle();
});
</script>
</body>
</html>

1 回复 | 直到 14 年前

BenMorel Pankaj Kumar 11 年前

resizable()在要调整大小的元素周围创建包装。

使用

$('.ui-wrapper',this).toggle();

而不是

 $('#ta1').toggle();

    $('#lg1').click(function(){
    $('.ui-wrapper',this.parentNode).toggle();
});

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

1 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前