假设我有一个看起来像这样的列表:

<ul style="width:980px;">
     <li style="display:block; float:left;">Lorem ipsum</li>
     <li style="display:block; float:left;">Lorem ipsum #2</li>
     <li style="display:block; float:left;">Lorem ipsum #3</li>
     <li style="display:block; float:left;">Lorem ipsum #4</li>
     <li style="display:block; float:left;">Lorem ipsum #5</li>
     <li style="display:block; float:left;">Lorem ipsum #6</li>
</ul>

我如何在此列表中找到每个锂的正确宽度?

目前,我尝试循环li,然后打印出outsideWidth,innerWidth和width。

所有人似乎都返回0作为宽度。

是否有关于如何正确获取元素的任何想法,而不必计算字符串的长度?

===============>>#1 票数:5 已采纳

您可以只使用width方法。 例如。

$('li').each(function() {
    alert( $(this).width() );
});

这要求:

  • 要加载的DOM(即从就绪的处理程序运行代码)
  • 页面上可见的元素
    • 元素本身无法display: none
    • 并且所有父元素必须可见

http://jsfiddle.net/DvNf5/

===============>>#2 票数:2

这段代码为我返回了宽度-

$("ul > li").each(function() {
    alert($(this).width());
});

演示-http://jsfiddle.net/CdyYa/

===============>>#3 票数:2

为我工作:

    $("li").each(function(){
       console.log( this.offsetWidth ); 
    });

//79 99 99 99 99 99

http://jsfiddle.net/63nxL/

===============>>#4 票数:1

使用jquery ... http://jsfiddle.net/y4X8S/ (小提琴使用console.log而不是Alert)

$( function(){
    $('li').each( function( i,el ){
        alert( $(el).width() );   
    } );
});

===============>>#5 票数:0

怎么样,而不是display: block; float: left; display: block; float: left;

display: inline-block;

  ask by Dannie Hansen translate from so

未解决问题?本站智能推荐:

4回复

jQuery-如何计算基于100%宽度的高度?

我有一个横幅,希望在所有设备上全角显示。 这样算出宽度就很好了: 但是,我正在努力弄清楚如何计算背景图像的实际高度,以便它以正确的分辨率完美显示。 任何帮助将是巨大的! 这是我所拥有的东西: http : //jsfiddle.net/52wow970/
6回复

JQUERY-在li上显示div单击else hide

我在下面找到了小提琴,我想做的是使“ #overlay” div在我单击“ .album” li以外的其他位置时隐藏。 Li'.album'在单击时应显示'#overlay'div,但当我单击'.album2'时应消失。 在这里摆弄 JAVASCRIPT CSS H
4回复

jQuery的分配不同的宽度
  • 分子
  • 我有一个HTML列表: 使用jQuery,我想为第一个<li>分配一个宽度等于10%,其他<li> (到第二个直到最后)分配其余宽度除以数字<li>的数字(例如90%/ 5) 我必须排除<li> exist un子列表 如何使用
    2回复

    使用jQuery指定LI的宽度时的幻像高度

    在像这样的简单ul和li结构上: ul显示为表格, li显示为表格单元格。 我将它们加载到DOM后使用jquery来修复li的宽度。 这是为了在更改字体系列时稳定宽度。 但是,在chrome上,我得到了幻像高度, a的宽度比jQuery计算的大10px +。 帮我解决这
    1回复

    LI总宽度计算并设置父UL或DIV

    如何计算总LI宽度并设置父div的宽度。 我的示例代码: CSS样式:
    9回复

    计算使用jQuery可见的li元素

    我用以下jQuery脚本计算我的li元素: HTML: jQuery的: - >脚本返回: 3 当$(document).ready with jQuery时,我改变了某些li元素的style="display: none"属性,如: $('.2').show(
    4回复

    jQuery-如何切换扩展/缩小宽度?

    到目前为止,我有一个单击功能可扩展宽度,但不确定如何切换将其收缩回其原始宽度。 缩小后,.button应该再次阅读“显示详细信息”。 小提琴链接: https : //jsfiddle.net/fpw9apmc/
    1回复

    jQuery-侧边栏可滑入并保持窗口宽度

    我一直在试图解决这个问题,但是我还没有设法解决。所以,我正在寻求您的帮助! 我想做的是:当用户单击按钮时,显示或隐藏侧边栏。 内容应紧随其后,并以与侧栏相同的方向滑动,并且用户不应看到y溢出。 这基本上就是我想做的: http : //mikedidthis-pierre.tumb
    1回复

    jQuery-更改宽度使页面跳至顶部

    我正在尝试使该导航侧栏在鼠标离开后滑动一段时间,以使文本部分扩展。 关键是,每当滑动功能启动时,页面就会跳到顶部。 没有使用“#”,我尝试了溢出-y:滚动,在函数末尾返回false,preventDefault,但没有任何效果。 这是js代码 这是小提琴: http : //j
    5回复

    jQuery-设置iframe宽度不起作用

    我知道,这个问题被问了2万亿次,但我还是做不完。 iframe是在我从外部Feed获取的源内部动态生成的。 我的jQuery是: 此代码无法设置iframe的宽度。 还有一件事情:我检查了iframe属性,并且在浏览器中无法像其他CSS样式一样进行编辑- 这意味着,在DOM