JQuery自动增长插件AJAX功能后无效
jQuery自动增长插件扩展文本区域以适应其内容。功能如下JQuery自动增长插件AJAX功能后无效,jquery,textarea,autogrow,Jquery,Textarea,Autogrow,jQuery自动增长插件扩展文本区域以适应其内容。功能如下 (function($) { /* * Auto-growing textareas; technique ripped from Facebook */ $.fn.autogrow = function(options) { this.filter('textarea').each(function() { var $this = $(this
(function($) {
/*
* Auto-growing textareas; technique ripped from Facebook
*/
$.fn.autogrow = function(options) {
this.filter('textarea').each(function() {
var $this = $(this),
minHeight = $this.height(),
lineHeight = $this.css('lineHeight');
var shadow = $('<div></div>').css({
position: 'absolute',
top: -10000,
left: -10000,
width: $(this).width(),
fontSize: $this.css('fontSize'),
fontFamily: $this.css('fontFamily'),
lineHeight: $this.css('lineHeight'),
resize: 'none'
}).appendTo(document.body);
var update = function() {
var val = this.value.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/&/g, '&')
.replace(/\n/g, '<br/>');
shadow.html(val);
$(this).css('height', Math.max(shadow.height() + 20, minHeight));
}
$(this).change(update).keyup(update).keydown(update);
update.apply(this);
});
return this;
}
})(jQuery);
但它不适用于新的textarea,而且FireBug中没有报告任何错误。救命啊
Fiddle-dee-dee-Fiddle-dee-dum如评论中所述,该小提琴是解决方案:
$(文档).ready(函数(){
$('textarea').autogrow();
$('.button')。单击(函数(){
$('.test').html('');
$('.test').find('textarea').autogrow();
});
});
无论如何将新的文本区域添加到dom中(手动或通过ajax回调方法),都必须使用jquery选择器来分配自动增长功能。发布此代码的JSFIDLE将非常有帮助。如果我没有弄错的话,js FIDLE不支持ajax调用。如果我错了,请state@JoshSmith我很高兴你弄明白了。作为将来的参考,JSFIDLE确实在左侧边栏中提供了一个测试AJAX请求的接口。和
$('textarea')。triggerHandler('change')代码>?您的小提琴不会模拟问题。这是我的。
$('.commentslogic').load(window.location.href + ' .commentslogic .inner', function(){
$('textarea').autogrow();
});
$(document).ready(function() {
$('textarea').autogrow();
$('.button').click(function() {
$('.test').html('<textarea></textarea>');
$('.test').find('textarea').autogrow();
});
});