javascript - jQueryeach() 不起作用？

Question

我正在运行一个 jQuery 函数，该函数应该根据视频的宽度修改视频的宽度。

我的页面中有很多视频，我想以某种方式使它们适应视频容器，该容器具有固定的宽度。所以在我之前讨论的函数中，我检查视频宽度是否高于容器的宽度，因此视频宽度应该更改为100%，而不是auto，这是所有视频最初都有的属性。

这是函数

$(document).ready(function () {
    $('video').each(function() {
        if ($(this).css('width')>$('.player-container')[0].css('width'))
        {
            $(this).css('width', '100%');
        }
    }); 
});

每个视频的放置方式:

<div class="player-container">
   <video class="player-video" width="auto" height="auto">
        <source src="video/mana-labios-compartidos.mp4">
        <source src="video/mana-labios-compartidos.webm">
   </video>
   // more stuff about the video...
</div>

问题是，我在每个 .each() 中放置了一个警报，但我只看到一个，它实际上只针对页面的第一个视频弹出。

Answer 1

使用 jQuery 对象作为数组，并指定索引实际上将返回 DOM 元素，因此不支持 jQuery 函数。如果您想要匹配集中的第一个元素，请使用 .eq(0) .

此外，请尝试使用 width()函数(因为它返回一个整数，而不是 .css('width') 返回的字符串。这对于您正在运行的比较特别方便。

您的最终代码将是:

if ($(this).width() > $('.reproductor-container').width())