为了自动调整我的textarea的大小,我使用:
<script>
$(function(){
$('.normal').autosize();
$('.animated').autosize({append: "\n"});
});
</script>
并更改单选按钮上div的内容,请单击我使用:
$(document).ready(function(){
$('input[name=content_type]').on('change', function(){
var n = $(this).val();
if(n == 1)
{
$('#postform').html("<textarea class=\"animated\"></textarea>");
}else if(n == 2)
{
$('#postform').html("<textarea class=\"animated\"></textarea>");
}else if(n == 3)
{
$('#postform').html("<textarea class=\"animated\"></textarea>");
}
});
});
这是HTML:
<form id="postform" name="post" action="phpfiles/post.php" method="POST">
<b>Regular Post</br></br></b>
<textarea class='animated1' name="Message" placeholder="Enter your post." maxlength="5000"></textarea>
<input type="hidden" name="post" value="1">
<button type="submit" class="postbutton">Click here to Post.</button>
</form>
<div class="radiobuttons">
<div class="text"><input type='radio' name='content_type' value='1' checked /> Text Post</div>
<div class="text"><input type='radio' name='content_type' value='2' /> Video or image</div>
<div class="text"><input type='radio' name='content_type' value='3' /> Youtube video</div>
</div>
如果我刷新页面并在textarea中输入一些文本,则它按预期工作,并且textarea的大小达到文本的高度。现在,如果我单击3个单选按钮中的1个,它将更改div的内容,但调整大小后将停止工作。
您如何解决?
最佳答案
实际上,由于您使用的插件,您的textarea
可以调整大小。页面加载后,您只需设置一次autosize
。用新的#postform
更改textarea
的全部内容后,应将autosize
重新应用于它:
$('.animated').autosize({append: "\n"});