1

我有一个带有类cover_container和img的div。用于获取 img 高度并将其应用于其父 div 的代码。这就是我所做的。

$('.cover_container').height($(".cover_container img").height());

容易的东西。但是,现在我在一页上有多个cover_containers,我开始挣扎。这是我所做的:

for($a = 0; $a < $('.cover_container').length; $a++) {
  $currentcovercontainer = $('.cover_container')[$a];
  $currentcovercontainer.height($currentcovercontainer.children('img')[0].height());
}

但是,这给了我以下错误:

[21:33:57.440] TypeError: $currentcovercontainer.children is not a function

我也尝试过 jQuery($currentcovercontainer).find('img')[0].height() 或 $currentcovercontainer.height($('> img').height() 之类的想法,但是没有成功。

关于我做错了什么的任何想法?

提前非常感谢!

4

3 回答 3

2

我将在Vanilla JS中编写它 - 如果必须,您可以保持原样或将其转换为 jQuery:

var qsa = document.querySelectorAll(".cover_container"),
    l = qsa.length, i;
// note: querySelectorAll is more widely supported than getElementsByClassName
for( i=0; i<l; i++) {
    qsa[i].style.height = qsa[i].querySelector("img").height+"px";
}

如果您的 HTML 是常规的,它可以变得更简单,例如<div class="cover_container"><img src="..." /></div>,因为这样您就可以使用qsa[i].children[0].height

于 2013-06-02T19:39:16.237 回答
2

您可以使用.each函数逐个执行函数

$('.cover_container').each(function() {
    var $this = $(this);
    $this.height($this.find("img").height());
});

请参阅 jsFiddle 上的此示例

于 2013-06-02T19:39:24.127 回答
1

$('.cover_container')[$a]给你一个 DOM 元素,而不是一个 jQuery 对象;

for(var $a = 0; $a < $('.cover_container').length; $a++) {
  var $currentcovercontainer = $($('.cover_container')[$a]);
  $currentcovercontainer.height($($currentcovercontainer.children('img')[0]).height());
}

...虽然eq()[],但为您返回一个 jQuery 对象;

for(var $a = 0; $a < $('.cover_container').length; $a++) {
  var $currentcovercontainer = $('.cover_container').get($a);
  $currentcovercontainer.height($currentcovercontainer.children('img').height());
}

each尽管使用;可能更具有 jQuery 风格

$('.cover_container').each(function () {
    var $this = $(this);

    $this.height($this.children('img').height());
});

另请注意,该$a语法通常用于表示 jQuery 对象;$a将是一个数字,而不是一个 jQuery 对象。不要忘记使用var:) 来声明你的变量。

于 2013-06-02T19:40:11.300 回答