jQuery 窗口调整大小

Question

我有一段 JavaScript 代码，应该在调整浏览器窗口大小时处理。

resize.style.marginRight=(resize.offsetWidth-$(this)[0].offsetWidth)+'px'

尝试了这个东西（不起作用）：

window.onresize = function(event) {
resize.style.marginRight=(resize.offsetWidth-$(this)[0].offsetWidth)+'px'
}

完整代码可用 - http:// jsbin.com/adelu3/2/（参见页面源代码）

Html（由脚本生成）：

<div class="resizable-textarea">
    <span>
        <textarea class="resizable processed" cols="" rows=""></textarea>
        <div class="resize"></div>
    </span>
</div>

谢谢。

Answer 1

$(this)[0].offsetWidth

offsetWidth 是元素的一个属性。在window.onresize的回调代码中，this是一个Window，它没有offsetWidth。

this 应该是什么？ （链接代码中不存在 onresize 事件。）如果要读取窗口宽度，请使用 $(window).width()。

如果您想读取封闭范围中作为 this 的其他某个（祖先？）元素的宽度，则必须通过从 resize 查找来找到该元素> 元素，或者保留对闭包中其他元素的引用，例如：（

var that= this;
$(window).resize(function() {
    resize.style.marginRight= resize.offsetWidth-that.offsetWidth+'px'
});

注意。$(this)[0] 完全不执行任何操作。）

Answer 2

自己做的。

这是一个混合解决方案，它共享@bobince 的代码和我自己的代码。

var tarea= this;
function resize_width(){ resize.style.width= tarea.offsetWidth+'px'}
resize_width();
$(window).resize(function() {resize_width()});