爲什麼while循環不起作用？

我在一行中有一個文本（空白：nowrap）。如果寬度大於父塊的寬度，我想減小此文本的字體大小。爲什麼while循環不起作用？

我使用while循環。爲什麼它不起作用？「elemWidth」的寬度沒有更新，循環和循環凍結？

$('.slider__title-wrap').each(function(){ 
    var width = $(this).width(); 
    var fontSize = 50; 
    var elem = $(this).find('.slider__title'); 
    var elemWidth = elem.width(); 

    while(elemWidth >= width) { 
     fontSize = Math.floor(fontSize * 0.96); 
     elem.css({fontSize: fontSize+'px'}); 
    }; 
})

來源

2015-09-27 jydralaro

你似乎沒有被改變或者'elemWidth'或'width'裏面的'而'循環。所以它要麼永遠不會開始，要麼永遠不會結束。 – Blazemonger

這裏你不需要'while'。您需要一個主動偵聽器來改變大小 – karthikr

當減小elemWidth的字體大小時，寬度會發生變化（內嵌塊），但是在循環寬度中不會更改，爲什麼？ – jydralaro

var elemWidth = elem.width();

使得elem.width();

您需要重新評估elemWidth到你的循環副本：

$('.slider__title-wrap').each(function(){ 
    var width = $(this).width(); 
    var fontSize = 50; 
    var elem = $(this).find('.slider__title'); 
    var elemWidth = elem.width(); 

    while(elemWidth >= width) { 
     fontSize = Math.floor(fontSize * 0.96); 
     elem.css({fontSize: fontSize+'px'}); 
     elemWidth = elem.width(); 
    }; 
})

來源

2015-09-27 16:58:02 Julien

謝謝，它解決了我的問題） – jydralaro

你似乎沒有被改變或者elemWidth或width的while循環中。所以它要麼永遠不會開始，要麼永遠不會結束。您需要循環結束之前更新你比較值：

$('.slider__title-wrap').each(function(){ 
    var width = $(this).width(); 
    var fontSize = 50; 
    var elem = $(this).find('.slider__title'); 
    var elemWidth = elem.width(); 

    while(elemWidth >= width) { 
     fontSize = Math.floor(fontSize * 0.96); 
     elem.css({fontSize: fontSize+'px'}); 
     width = $(this).width(); 
     elemWidth = $(this).find('.slider__title').width(); 
    }; 
});

另外，消除變量，使您不必進行任何更新：

$('.slider__title-wrap').each(function(){ 
    var fontSize = 50; 

    while($(this).width() >= $(this).find('.slider__title').width()) { 
     fontSize = Math.floor(fontSize * 0.96); 
     elem.css({fontSize: fontSize+'px'}); 
    }; 
});

順便說一句，我會使用fontSize = fontSize-1;，而不是乘以0.96，但它可能是一個微型優化。

來源

2015-09-27 16:55:57 Blazemonger

爲什麼while循環不起作用？

回答

相關問題