lucaong / jQCloud

jQuery plugin for drawing neat word clouds that actually look like clouds
MIT License
646 stars 293 forks source link

afterCloudRender not recognizing the spans #38

Open dietah opened 11 years ago

dietah commented 11 years ago

In a tool I'm developing we need to be able to trigger some actions for each word in the generated cloud.

When using the afterCloudRender the correct callback is triggered but none of the words are found.

var _MakeWordsClickable = function () {
        console.log('callback start');
        console.log($('div#wordcloud span').size());

        $('div#wordcloud span').each(function () {
            $(this).click(function () {
                console.log($(this).text());
            });
        });

        console.log('callback end');
    }

The console shows 'callback start' and 'callback end' but the size of the spans is 0.

When I execute the code with a timeout of 200 miliseconds everything works.

$("#wordcloud").jQCloud(objCloud, { afterCloudRender: setTimeout('_MakeWordsClickable()',200) });

I tried to circumvent the timeout by using the afterWordRender at each word, but the same problems exists.

So in essence, jQCloud is not waiting until the cloud is completely rendered.

Thanks for looking into this.

descl commented 10 years ago

same problem here, is there a better fix than using timeout? thanks, chris

dietah commented 10 years ago

Hi Chris,

In _MakeWordsClickable() I used the jQuery .on() command which is like a live bind, so as each word is added to the cloud it automatically gets that code.

For example:

var _MakeWordsClickable = function(){   
        $('div#wordcloud').on('click', 'span', function(){
            // do something
        });             
}

This way there is no need for a timeout, which would be subject to the amount of words loaded.

Hope this helps.

Thanks, Dieter