javascript - how do i capture which number <div> got clicked on inside my container <div> and store it in a variable -


edit: code held inside $(document).ready(function() {} because of this, , because html code generated inside javascript file on fly, experiencing issues using .click() when applying answer given use

$('.movies_cell').click(function(){     var tmp = $(this).index(); }); 

original: have 20 div elements on page class of .movies_cell generated ajax file. of div's created within container div called #movies.

any of .movies_cell div's can clicked bring modal box, because going place information json file in modal depending on gets clicked need know div got clicked, instance, if 5th div want know 5th div clicked , store number in variable, if 2nd, or 3rd want number stored in variable , clear when .movies_cell div gets clicked.

how write javascript or jquery script accomplish this? :(

thanks!

  $('#mymovies').click(function () {       $.getjson('data/movies.json', function (alldata) {           $.each(alldata, function (i, field) {               $('#movies').append(function () {                   var movies = '<div class="movies_cell">';                   movies += '<div class="movies_image">';                   movies += '<a href="#openmodal"><img src="img/movies/' + (field.image) + '" alt="' + (field.name) + ' poster" style="width: 100%; height: 100%"></a>';                   movies += '</div>';                   movies += '<div class="movies_detail">';                   movies += '<a href="#openmodal"><h1>' + (field.name) + '</h1></a>';                   movies += '<img src="img/rating/' + (field.myrating) + '.png" alt="movie rating" style="margin: auto;">';                   movies += '</div>';                   movies += '</div>';                   counter++;                   console.log(counter);                   return movies;               });           });       });   }); 

use event delegation.(https://api.jquery.com/on#direct-and-delegated-events) @ top

 $('#movies').on( "click", ".movies_cell > div", function() {    var tmp = $(".movies_cell > div").index(this);    console.log(tmp); }); 

then

 $('#mymovies').click(function () { //rest of code 

Comments

Popular posts from this blog

android - Why am I getting the message 'Youractivity.java is not an activity subclass or alias' -

python - How do I create a list index that loops through integers in another list -

c# - “System.Security.Cryptography.CryptographicException: Keyset does not exist” when reading private key from remote machine -