jQuery $('。div')。每个只运行一次迭代

时间:2012-12-17 17:04:02

标签: jquery html css

编辑:对于任何关心的人来说,问题是如此简单以至于我忽略了它,因为如果右侧的列是具有额外内容的列,它会尝试更改左侧的列,因此我使用的是表格。它仍然会有更高的高度,虽然减小文本大小实际上不会修复它因此导致我得到的循环,解决方案是使用独立的div而不是!希望这有助于某人!

我正在尝试编写一些jQuery的问题。我想要做的是遍历每个具有相同类的div,如果div的高度大于25px,则将字体大小减小1px直到它适合一行。

我为第一个代码工作的代码,但不在其他div上运行,任何帮助都会很棒!

此致

Shikoki

$(document).ready(function() {
        $('.lmmteam').each(function() {
            $('.lmmteam').css('font-size', '30px');
                while( $('.lmmteam').height() > 25 ) 
                    {
                        $('.lmmteam').css('font-size', (parseInt($('.lmmteam').css('font-size')) - 1) + "px" );
                    }
            });
    });

我想我应该添加html标记,以便您在此处更轻松!

<table>
  <tr>
    <td class="randomclass"></td>
    <td class="lmmteam">Long text</td>
    <td class="randomclass"></td>
    <td class="randomclass"></td>
    <td class="lmmteam">Long text</td>
    <td class="randomclass"></td>
  </tr>
  <tr>
    <td class="randomclass"></td>
    <td class="lmmteam">Long text</td>
    <td class="randomclass"></td>
    <td class="randomclass"></td>
    <td class="lmmteam">Long text</td>
    <td class="randomclass"></td>
  </tr>

有几行,但格式保持不变。谢谢!

6 个答案:

答案 0 :(得分:3)

您必须使用$(this)进行迭代。

请参阅:http://jsfiddle.net/4St7V/1/

答案 1 :(得分:2)

您必须遍历同一个元素,然后才能使用"-=1"

$('.lmmteam').each(function() {
    $element = $(this);
    $element.css('font-size', '30px');
    while( $element.height() > 25 ) {
        $element.css('font-size', "-=1");
    }
});

答案 2 :(得分:1)

尝试

$(document).ready(function() {
    $('.lmmteam').each(function() {
        $(this).css('font-size', '30px');
        while ($(this).height() > 25) {
            $(this).css('font-size', (parseInt($(this).css('font-size'),10) - 1) + "px");
        }
    });
});​

<强> jsFiddle example

答案 3 :(得分:0)

如果您使用的是.each(function(),则应使用$(this)来迭代这些项目。

答案 4 :(得分:0)

尝试

$(document).ready(function() {
        $('.lmmteam').each(function() {
            $(this).css('font-size', '30px');
                while( $(this).height() > 25 ) 
                    {
                        $(this).css('font-size', (parseInt($(this).css('font-size')) - 1) + "px" );
                    }
            });
    });

答案 5 :(得分:0)

三个班轮解决方法:

$('.lmmteam').css('font-size', '30px').filter(function(){
    return $(this).height() > 25;
}).css('font-size', '-=1px');