Jquery ui 使用jquery计算多个类中子元素的总宽度

我有以下代码

 <span class="numbers">
    <a href="#">20</a>, <a href="#">50</a>, <a href="#">100</a>
 </span>

但我得到的总宽度值仅为0。有人能帮忙吗

请检查这把小提琴

变化是这样的：

totalWidth += $(this).width();

输入显示计算出的宽度为56。

这适用于我

---

首先，您需要遍历所有

数字

元素。然后在该循环中，循环属于每个

numbers

span的子级

$('.numbers').each(function() {
    var totalWidth = 0;
    /* "this" in this loop is the current numbers span*/
    var $self=$(this) 
   /* loop over all the children of this element*/
    $self.children('a').each(function() { 
        /* "this" in current loop is an A tag*/
        totalWidth += $(this).width();      
    });

    /* now set width*/
    $self.width( totalWidth)

})

此语句将影响整个页面中包含该类的所有元素，并且它们的宽度都相同

$('.numbers').width(totalWidth); 

---

您确定需要javascript来完成此操作吗？使a标签块向左浮动，父容器应该随着内容的变化而调整大小。不，因为我在页面上多次使用“.number”。所以它的宽度应该是动态变化的最重要的是它的位置：绝对元素。你的代码实际上是为我工作的-你可以设置一个小提琴的问题或链接我们到一个实时页面？嗨，我已经设置了一个jsFiddel请看@你的代码对我有用，这不是问题所在。复习你的答案以避免沮丧似乎我已经回答了这个问题。这是一个意外的提交，如果它仍然不正确，我很抱歉。非常感谢。你的代码对我来说非常有效。我只是随便玩玩。

$('.numbers').each(function() {
    var totalWidth = 0;
    /* "this" in this loop is the current numbers span*/
    var $self=$(this) 
   /* loop over all the children of this element*/
    $self.children('a').each(function() { 
        /* "this" in current loop is an A tag*/
        totalWidth += $(this).width();      
    });

    /* now set width*/
    $self.width( totalWidth)

})

$('.numbers').width(totalWidth);