我是jQuery / Java的新手,甚至对精巧的jQuery / Java的精练都比较新。
我试图重新创建一些在Materialize Framework的表单组件中找到的功能。如果您访问以下链接:
http://materializecss.com/forms.html
您将看到他们的示例<textarea>
元素根据元素中的行数进行扩展/收缩。 (这是我对它如何工作的假设;由于缺乏对jQuery的了解,所以我不确定它的完成方式。我无法在缩小的脚本中找到所需的内容)。
我不相信这是用纯CSS完成的,所以这就是为什么我一直在浏览.js的原因。
我试图用我有限的知识来重新创建功能,但是我的代码还有很多不足之处。
$('textarea').keyup(function() {
if($(this).rows == +1) {
console.log('+1 row');
$(this).animate({'height': '+=16'}, 250);
} else if (this.rows == -1) {
console.log('-1 row');
$(this).animate({'height': '-=16'}, 250);
}
});
如果任何人都能够纠正我的脚本或准确确定Materialize Framework发生了什么,以便我可以不依赖于框架本身来重新创建它,我将永远感激不已。
提前致谢。
最佳答案
可能有帮助
$('textarea').keyup(function() {
$(this).css({'height': 'auto'});
$(this).height( this.scrollHeight );
});
Jsfiddle
关于javascript - $ ('textarea').rows展开/收缩,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33314462/