Hi
I am very new to jQuery and I have been butchering someone else's script. I am creating a tag cloud that when a tag (<span> some text</span>) is clicked on it populates or updates a text box.
I have got the tag to be in random sizes and places but I can’t get the on click to work.
I know I am probably doing something fundamentally wrong.
Below is the script for the HTML page
- <div id="tagcloud" class="tagcloud"> Image converter. Image converter. Image resizer. Png to ico. Png to ico. Png to ico. Ico to png. Png to jpg. Jpg to png. Jpg to png. Bmp to jpg. Jpg to bmp. Jpg to gif. Gif to jpg. Png to gif. Png to gif. Gif to png. Online. Online. Free. Free. Free </div>
And
- $(function() { $('#tagcloud').tagCloud({}); });
Below is the script from the jQuery
- (function($){
- $.fn.tagCloud = function(options) {
-
- var defaults = {
- randomize: true
- };
-
- var trim = function(text){
- return text.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
- };
-
- return this.each(function() {
- var arr = $(this).text().split("\.");
- if (options.randomize) arr.sort(Math.round(Math.random())-0.5);
- var words_arr = {};
- $(arr).each(function(i){
- word = trim(this);
- words_arr[word] = words_arr[word]? words_arr[word] + 1 : 1;
- });
- var html = '';
- $.each(words_arr, function(k, v) {
- v = (v > 10)? 10 : v;
- v = (v >= 3)? '2' + '.' + v : v;
- function updatetag(tagval)
- {
- var learTags = document.getElementById("LearningTags");
- learTags.value = learTags.value + tagval;
- }
- html += "<span style=\"font-size: " + v + "em; cursor: pointer;\" onclick=\"javascript:updatetag(" + k + ");\" > " + k + " </span>";
-
- });
- $(this).html(html);
- });
- };
- })(jQuery);
Sorry to the person that made the code originally, but I have been working on it for about 3 days and still can’t get it to work, so your code has been butchered a lot.