ansaurus

Question

jQuery/JavaScript: Why does this freeze?

Answer 1

A:

within your $.fn's your using this instead of the jQuery $(this).. This could be causing an infinite loop in your while () statement.

pharalia 2010-08-31 08:45:09

Nope, in a jQuery plugin ($.fn....), this is the jQuery object so no need for $(this)

Vincent Robert 2010-08-31 08:49:03

Answer 2

A:

I think you're using line-height the wrong way. That property only gives you the height of each line in a paragraph, it's used to measure space between two lines, not to count how many lines you have in your paragraph.

You remove text from the content in your truncateLineCount() but lineCount always has the same value, thus the while cycle is never ending...

P.S. Be careful: truncateLineCount also removes html (char by char), not only text.

mamoo 2010-08-31 08:45:47

Answer 3

+1 A:

The default value for the line-height CSS property is normal. This line:

var lineHeight = this.css("line-height"); // returns "Xpx"

Is actually returning "normal", which your code then attempts to parse into an integer, which yields NaN.

http://www.w3.org/TR/CSS2/visudet.html#propdef-line-height

Aside from that, as others have mentioned, your loop removes 1 character and adds another 8 so it will never get any shorter. You should append … after the loop ends and your line is short enough:

            while (this.lineCount() > countAfterTruncation) {
                this.html(this.html().slice(0, -1));
            }
            this.html(this.html()+"&hellip;");

As an aside, I feel it necessary to add a few pointers for your code:

As I mentioned in the comments, you don't need to snip off the px when parsing a string like "12px" with parseInt().
Don't use the var keyword inside a loop, this reinitializes the variable on each iteration which, aside from being bad practice, will throw an error in ECMAScript 5th's strict mode.
You can use the slice() method with a negative offset for the second parameter instead of using substring() and passing string length - 1.
Instead of document.getElementById(this.attr("id")), you can just use this.get(0). this is already an element wrapped by jQuery, you can access the underlying element using the get() method.
If you can help it, don't manipulate html()/innerHTML inside loops. The performance is very poor since it invokes the HTML parser on every iteration of the loop.

Andy E 2010-08-31 08:49:26

Answer 4

+1 A:

I don't think your truncate function works.

At each iteration of your while loop, you are removing 1 character but adding 8 more ("…").

You may want to add the ellipsis after the loop.

Vincent Robert 2010-08-31 08:52:30

Answer 5

+1 A:

this.html(text.substr(0, text.length - 1) + "&hellip;");

this line increases the charater count. it removes last character, but it adds "…" to end of the line. so the text will never be truncated.

if your text is My MVC Application, after some while loop, it becomes: My MVC Applicatio................

your loop should be:

while (this.lineCount() > countAfterTruncation) {
    var text = this.html();
    this.html(text.substr(0, text.length - 1));
}
this.html(this.html()+"&hellip;");

feridcelik 2010-08-31 08:53:09

ansaurus

tags:

views:

answers:

jQuery/JavaScript: Why does this freeze?

related questions