passing event data dynamically in jquery

Question

Please refer below HTML

<div class="Icon">
                <span>
                        <img src=""/>
                    </span>

            </div>

I am adding class "bootstrap-modal" dynamically to above IMG tag when it is clicked.

$(".Icon img").on("click", function (e) {
            var data="some object";     
            $(this).addClass("bootstrap-modal");
    });

Then i have one more click event for bootstrap-modal class like below

$(document).on('click',"bootstrap-modal" function (e,data) {

//here i need to get data object 
});

how to pass data object from img click event to bootstrap-modal click event?

That means I need to get some values from previous click handler ? How can I do this ?

VisioN · Accepted Answer · 2014-04-14 14:17:31Z

3

Save it in data:

$('.Icon img').on('click', function(e) {
    var data = 'some object';
    $(this).addClass("bootstrap-modal").data('test', data);
});

$('.Icon').on('click', '.bootstrap-modal', function(e, data) {
    var data = $(this).data('test');
});

FYI: Since you use the newest version of jQuery, you'd better use on method with event delegation instead of deprecated live. Here .Icon is supposed to be a static parent element of .bootstrap-modal.

answered Apr 14, 2014 at 14:17

VisioN

146k35 gold badges287 silver badges291 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

mplungjan Over a year ago

If he has .on in one event handler he obviously has .on available in the other

SivaRajini Over a year ago

@VisioN Thanks . i dont want to use data-attribute concept.because it will add attribute to that element. i don't want this behavior? any other way ?

VisioN Over a year ago

@mplungjan :D haven't noticed that! I will update the answer then.

VisioN Over a year ago

@SivaRajini Who said that .data() method will add the attribute to the element? It will not.

VisioN Over a year ago

@SivaRajini Forget about data attributes. .data() method can set any data for any element internally. You may store arrays, objects, strings, whatever.

|

Collectives™ on Stack Overflow

passing event data dynamically in jquery

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related