jquery - Issue with this.variable -


i looking way give div.rune.ixxx/div.rune.i +index integer limited itself, called upon child within itself.

layout: ...-container -> div.rune.i +index -> p

here section of jquery having issues with...

jquery("body").on("click", "td", function() {     if($(this).is('td.entry-name') || $(this).is('td.icon')) {         if(!this.i){this.i = 0;} //<--- issue here         var gettext = $(this).siblings('td.index').text();         var gettype = $(this).siblings('td.type').text();         console.log(gettext); //id check         $.getjson("http://ddragon.leagueoflegends.com/cdn/4.14.2/data/en_us/rune.json", function(response){             $.each(response.data, function (index, entry) {                 if(index == gettext) {                     console.log(entry.name); //name check                     if(gettype == "mark") {                         if($('div.mark-container').children('div.rune.i' +index).length > 0) {                             this.i++;                                                            $('div.rune.i' +index+ ' p').text('x' +this.i);  //<--- issue here                         } else {                             $('div.mark-container').append('\                             <div class="rune i' +index+ '" \                             style="background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"><p></p></div>');                         };                     } else if(gettype == "seal") {                         if($('div.seal-container').children('div.rune.i' +index).length > 0) {                             this.i++;                                                            $('div.rune.i' +index+ ' p').text('x' +this.i);                         } else {                             $('div.seal-container').append('\                             <div class="rune i' +index+ '" \                             style="background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"><p></p></div>');                         };                     } else if(gettype == "glyph") {                         if($('div.glyph-container').children('div.rune.i' +index).length > 0) {                             this.i++;                                                            $('div.rune.i' +index+ ' p').text('x' +this.i);                         } else {                             $('div.glyph-container').append('\                             <div class="rune i' +index+ '" \                             style="background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"><p></p></div>');                         }                     } else if(gettype == "quint") {                         if($('div.quint-container').children('div.rune.i' +index).length > 0) {                             this.i++;                                                            $('div.rune.i' +index+ ' p').text('x' +this.i);                         } else {                             $('div.quint-container').append('\                             <div class="rune i' +index+ '" \                             style="background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"><p></p></div>');                         };                     };                 };             });         });     }; }); 

here rest of code. not sure how describe issue, when select list left, it'll appear in container right, if try add item again should add xint item on right, setting multiple. response xnan.

tl;dr: need give parent of p variable applies itself, called child add , display itself.

the problem this called inside each loop , doesn't refer element clicked outside of it. save this new variable before going each-loop in fiddle , should work fine

       var thisthing = this;         $.getjson("http://ddragon.leagueoflegends.com/cdn/4.14.2/data/en_us/rune.json", function(response){             $.each(response.data, function (index, entry) {                 if(index == gettext) {                     console.log(entry.name); //name check                     if(gettype == "mark") {                         if($('div.mark-container').children('div.rune.i' +index).length > 0) {                             thisthing.i++;                                                           $('div.rune.i' +index+ ' p').text('x' +thisthing.i);                         } else {                             $('div.mark-container').append('\                             <div class="rune i' +index+ '" \                             style="background:url(./assets/runes/rune0.png) -' +entry.image.x+ 'px -' +entry.image.y+ 'px no-repeat"><p></p></div>');                         }; 

Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -