dcsimg
www.webdeveloper.com
Results 1 to 4 of 4

Thread: adding click function to custom object

  1. #1
    Join Date
    Apr 2010
    Location
    Brooklyn NY
    Posts
    104

    adding click function to custom object

    I'm trying to add a click function to my object. The way i have it now in bold is how I saw someone else use it, it doesn't work. I tried using jquery's bind('click') and this.div.onclick but it runs the function right away upon instantiation.

    How can i get this to run only when clicked?

    function bubble(id,title,description,year,bubbleIcon,icon,source,length) {//art object from xml
    this.id = 'bubble' + id;
    this.title = title;
    this.descrip = description;
    this.year = year;

    this.div = document.createElement('div');
    $(this.div).addClass('icon');
    this.div.id = 'iconDiv' + id;

    this.bubble = document.createElement('img');
    this.bubble.id = 'iconBubble' + id;
    this.bubble.src = bubbleIcon;

    this.icon = document.createElement('img');
    this.icon.id = 'icon' + id;
    $(this.icon).addClass('hidden');
    this.src = icon;

    this.source = '<img src="' + source + '" id="fullImg' + id + '" />';
    this.length = length;

    this.timer = null;
    this.interval = 10;
    var _this = this;

    $('#content').append(this.div);
    $(this.div).append(this.bubble).append(this.icon)
    .css({ marginTop : (Math.random() * ((bHeight * .5) - (bHeight * .15))) + 125 + 'px',
    marginLeft : (id * 250) + 125 + 'px' });
    bubbleArray.push(this);

    this.div.click(function() {
    _this.alertMsg();
    });


    }

    bubble.prototype.alertMsg = function() {
    alert('been clicked ');
    }

  2. #2
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,774
    Change:

    this.div = document.createElement('div');

    To

    this.div = jQuery(document.createElement('div'));

    The line:

    this.div.click(function() {...})

    Is calling a method on a jQuery collection, but this.div refers to a raw DIV tag, not a jQuery wrapped DIV tag.

  3. #3
    Join Date
    Apr 2010
    Location
    Brooklyn NY
    Posts
    104
    Thanks that works, is there a tutorial or an article that explains what you can do with the jQuery() tag because half my code is regular javascript half jquery and I'm clueless if it should all be one or the other.

  4. #4
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,774

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles