使用/ jQuery基于父级调整宽度

Question

我需要能够根据父级的宽度调整类的宽度。目前.myClass在CSS中分配了宽度。这样的事情会起作用吗？

.myClass {
    color: #000;
    width:100px;
}

$(".myClass").width($(".myClass").parent().width());

这将应用于<DIV>，父级可以是<TD>或其他<DIV>。

Answer 1

你有什么应该工作，但我可能会改变它：

$(".myClass").css("width",$(".myClass").parent().css("width"));

您可以使用this代替第二个$(".myClass")，但您必须对其进行测试。

请记住，它并没有改变课程本身。它正在改变使用该类的任何元素的宽度。

更新：

如果您要使用父宽度进行任何类型的计算，那么您应该坚持使用原始方法。当您按“原样”应用样式时，我喜欢css，但这是个人偏好。如果您对父值进行任何类型的修改，那么width可能会更好。

从宽度文档：

  

建议使用.width（）方法   当元素的宽度需要时   用于数学计算。

Answer 2

var parentW = $('.myClass').parent().width();
$('.myClass').width(parentW);

DEMO1

$('.myClass').width( $('.myClass').parent().width() );

DEMO2

如果你有更多的课程'myClass'：

$('.myClass').each(function() {
    var myClass = $(this);
    var parentW = myClass.parent().width();
    myClass.width(parentW);
});

DEMO3

这里是一个很难的代码:(没有javascript）;）

DEMO4

如果你听过这首歌，那就是'副歌'：（聪明的解决方案）：

$('.myClass').css({width: 'auto'});

DEMO5