blocks|key|1967299|text|使用jQuery对象作为数组，指定索引实际上将返回DOM元素，因此不支持jQuery函数。如果您想要匹配集合中的第一个元素，请使用.eq(0)。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1967300|另外，尝试使用width()函数(因为它返回一个整数，而不是.css('width')返回的字符串)。对于您正在运行的比较程序来说，这特别方便。|1967301|您的最终代码是：|1967302|if+($(this).width()+>+$('.reproductor-container').width())|code-block|syntax|javascript|1967303|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/eq/|1|http://api.jquery.com/width/^0|1T|6|1T|6|0|0|7|7|U|D|7|7|1|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@$9|Z|A|10|B|C]]|D|@$9|11|A|12|1|13]]|E|$]]|$1|F|3|G|5|6|7|14|8|@$9|15|A|16|B|C]|$9|17|A|18|B|C]]|D|@$9|19|A|1A|1|1B]]|E|$]]|$1|H|3|I|5|6|7|1C|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|1D|8|@]|D|@]|E|$M|N]]|$1|O|3|-4|5|6|7|1E|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]|W|$5|R|S|T|E|$U|X]]]]

Using a jQuery object as an array, and specifying an index will actually return the DOM element, and thus the jQuery functions aren't supported. If you want the first element in the matched set, use <a href="http://api.jquery.com/eq/" rel="nofollow"><code>.eq(0)</code></a>.

Also, try using the <a href="http://api.jquery.com/width/" rel="nofollow"><code>width()</code></a> function instead (since it returns an integer, rather than the string returned by <code>.css('width')</code>. This is particularly handy for comparrisons such as those you're running. 

Your final code would be:

<pre><code>if ($(this).width() &gt; $('.reproductor-container').width())
</code></pre>

blocks|key|1967323|text|我想你的选择是错的|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1967324|而不是使用|1967325|$('.player-container')[0].css('width')|code-block|syntax|javascript|1967326|试着使用|1967327|$('.player-container').eq(0).css('width')|1967328|为了安全起见，.css(“宽度”)返回的是一个数字，而不是像“200+is”这样的字符串。|1967329|if+(parseInt($(this).css('width'))+>+parseInt($('.player-container').eq(0).css('width'))){|1967330|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|V|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

I guess your selector is wrong 

instead of using 

<pre><code>$('.player-container')[0].css('width')
</code></pre>

try to use

<pre><code>$('.player-container').eq(0).css('width')
</code></pre>

for beeing safe that .css('width') is returning a number and not a string like "200px" 

<pre><code>if (parseInt($(this).css('width')) &gt; parseInt($('.player-container').eq(0).css('width'))){
</code></pre>

blocks|key|3559130|text|$('.player-container')[0]|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|3559131|获取一个元素，所以|unstyled|3559132|$('.player-container')[0].css('width')|3559133|会给你一个TypeError。试一试|3559134|$('.player-container').css('width')|3559135|而不是。|3559136|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|R|8|@]|9|@]|A|$]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$B|C]]|$1|I|3|J|5|F|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$B|C]]|$1|M|3|N|5|F|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|F|7|W|8|@]|9|@]|A|$]]]|P|$]]

<pre><code>$('.player-container')[0]
</code></pre>

gets an element, so

<pre><code>$('.player-container')[0].css('width')
</code></pre>

will give a TypeError. Try

<pre><code>$('.player-container').css('width')
</code></pre>

instead.

blocks|key|3587171|text|.css()是一个应该在jQuery对象上使用的方法，但是您在jQuery对象内的DOM元素上使用它。此外，它还返回一个在您的情况下无用的字符串，因此您需要使用.width()，它返回一个整数。如果需要按索引指定元素，请使用.eq()。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3587172|您完成的代码应该是这样的：|3587173|$(document).ready(function+()+{
++++$('video').each(function()+{
++++++++if+($(this).width()+>+$('.player-container').eq(0).width()){
++++++++++++$(this).css('width',+'100%25');
++++++++}
++++});+
});|code-block|syntax|javascript|3587174|这可能不适合您，但我认为仅通过将每个视频元素上的max-width设置为100%25即可达到同样的效果：|3587175|.player-container+video+{
++++max-width:+100%25;
}|3587176|entityMap^0|0|6|28|8|34|5|0|0|0|O|9|10|4|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]|$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Z|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|10|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|11|8|@$9|12|A|13|B|C]|$9|14|A|15|B|C]]|D|@]|E|$]]|$1|O|3|P|5|J|7|16|8|@]|D|@]|E|$K|L]]|$1|Q|3|-4|5|6|7|17|8|@]|D|@]|E|$]]]|R|$]]

<code>.css()</code> is a method that should be used on a jQuery object, but you're using it on the DOM element inside the jQuery object. Also, it returns a string which would be useless in your case, so you need to use <code>.width()</code> instead, which returns an integer. If you need to target an element by index, use <code>.eq()</code>.

This is how you finished code should look like:

<pre><code>$(document).ready(function () {
 $('video').each(function() {
 if ($(this).width() &gt; $('.player-container').eq(0).width()){
 $(this).css('width', '100%');
 }
 }); 
});
</code></pre>

This might not be suitable for you, but I think the same effect can be achieved with CSS alone, by setting the <code>max-width</code> on every video element to <code>100%</code> as follows:

<pre><code>.player-container video {
 max-width: 100%;
}
</code></pre>

blocks|key|3587189|text|这个问题的原因是你不去相关的视频容器。做这样的事：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3587190|$(document).ready(function+()+{
++++$('video').each(function()+{
++++++++if+($(this).width()+>+$(this).parent().width())
++++++++{
++++++++++++$(this).css('width',+'100%25');
++++++++}
++++});+
});|code-block|syntax|javascript|3587191|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

The problem causes because you don't go to the relative video container. Do something like this:

<pre><code>$(document).ready(function () {
 $('video').each(function() {
 if ($(this).width() &gt; $(this).parent().width())
 {
 $(this).css('width', '100%');
 }
 }); 
});
</code></pre>

I am running a jQuery function that is supposed to modify the width of a video depending on its width. 

I have a bunch of videos in my page and I want to adapt them to the video container somehow, which has a fixed width. So in the function I was talking about before I check if the video width is higher than the container's, so then the video width should be changed to 100%, instead of auto, which is the property that all the videos have originally.

Here is the function

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

How every video is placed:

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

The thing is that I am placing an alert inside each <code>.each()</code> and I only see one, it pops just for the first video of the page actually.

jQuery each() isn't working?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正在运行一个jQuery函数，它应该根据视频的宽度来修改它的宽度。我有一堆视频在我的页面，我想让它们适应视频容器，它有一个固定的宽度。所以，在我检查视频宽度是否高于容器的函数之前，应该将视频宽度更改为100%，而不是自动，这是所有视频最初所具有的属性。这是函数$(document).ready(function ()...

问jQuery each()不工作吗？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery each()不工作吗？EN