Question

我正在寻找一种给div.rune.iXXX / div.rune.i +index一个整数的方法，这个整数仅限于自身，但后来由一个孩子自己调用。

布局：...-container -> div.rune.i +index -> p

以下是我遇到问题的jQuery部分......

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 is the rest of the code。我不确定如何描述问题，但是当您从左侧列表中选择某些内容时，它会出现在右侧的容器中，如果您尝试再次添加该项，则应添加{{1} }到右边的项目，将其设置为倍数。但目前您得到的答案是xINT。

tl; dr：我需要为xNaN的父项提供一个仅适用于自身的变量，然后由子项调用以添加到自身并显示自身。< / p>

Answer 1

您正试图获取不正确对象的.i值。在

$.each(response.data, function (index, entry) {}

函数this指向另一个对象。所以它应该是这样的：

if(!this.i){this.i = 1;}
var thisEl = this;

以后：

thisEl.i++;                             
$('div.rune.i' +index+ ' p').text('x' +thisEl.i);

Updated fiddle

Answer 2

问题是在this循环内调用了each并且没有引用在其外部点击的元素。在进入每个循环之前将this保存到新变量，如此fiddle，它应该可以正常工作

       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>');
                        };

与this.variable问题

2 个答案: