Internet Explorer 中动态内容的自动增长 jQuery 插件
我在这里使用插件 http://plugins.jquery.com/project/autogrow 并且我在 Internet Explorer 和 Chrome(不是 Firefox)中遇到问题
请参阅下面的代码:
<script type="text/javascript">
$(document).ready(function() {
$('#main').html('<textarea class=\"test\">aaaa</textarea>');
$('.test').autogrow();
</script>
</head>
<body>
<div id="main">
</div>
</body>
</html>
基本上,如果元素在启动页面后是新的,则它不起作用。所以我稍微侵入了这个插件,并使用 livequery 更改了这些行(第 68 行),
this.textarea.livequery(function() {
$(this).focus(function() {self.startExpand()});
$(this).blur(function() {self.stopExpand()});
});
但是尽管 Firefox 没问题,但这仍然不起作用。
你能帮忙吗?
I am using plugin here http://plugins.jquery.com/project/autogrow and I got a problem in Internet Explorer and Chrome (Not Firefox)
See code below:
<script type="text/javascript">
$(document).ready(function() {
$('#main').html('<textarea class=\"test\">aaaa</textarea>');
$('.test').autogrow();
</script>
</head>
<body>
<div id="main">
</div>
</body>
</html>
Basically if the element is new after start the page, it does not work. So I hacked into the plugin a bit and changed these lines using livequery (line 68)
this.textarea.livequery(function() {
$(this).focus(function() {self.startExpand()});
$(this).blur(function() {self.stopExpand()});
});
However that still does not work although Firefox is OK.
Can you help?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
我通过进行以下两项更改使其在 Chrome/Safari 中工作:
$('#main').html('');
"if(this.line_height) == NaN)
" 到 "if(isNaN(this.line_height))
"在 Chrome/Safari 中效果相当不稳定,这似乎与 WebKit 报告新的文本区域的应用高度比您设置的少 4px,我认为这是由于盒模型和某些浏览器应用的样式造成的,但我不知道。如果您对 FF 中的效果感到满意,那么这应该可行,因为它在 FireFox 中也很不稳定。
I have made it work in Chrome/Safari by making the following two changes:
$('#main').html('<textarea class=\"test\">aaaa</textarea>');
" to include aline-height
style, for example: "$('#main').html('<textarea class=\"test\" style=\"line-height: 16px\">aaaa</textarea>');
"if(this.line_height == NaN)
" to "if(isNaN(this.line_height))
"The effect is quite jittery in Chrome/Safari, this seems to be something to do with WebKit reporting the newly applied height of the textarea as 4px less then you set it to, I assume this is due to the box model and some browser applied styles, but I don't know. If your happy with the effect in FF then this should work, as it's also quite jittery in FireFox.