Question

我正在运行一个循环，它检查div的内容（它是一个小的4拼图拼图，从XML文件中获取的数据。现在我有一个变量使它运行到div＃1A到＃4A。现在我使用相同的变量进入div，看看是否有一个与父ID具有相同类的图像。这是我的jquery：

        //Run this when they want to check the answer
        $(document).ready(function() {
            var correctPositions = 0;

            function handleForm(count) {
                //Build div var
                console.log("clickDetected");
                var div = "#"+ count +"A";
                console.log("This is the counter "+count);
                console.log("This is the div im looking into: "+div);

                //Check if div actually has children
                if ($(div).children().length > 0){
                    var childId = $(div + ":first-child").attr("id");
                    //Got HTML to test if there really wasn't anything, returns: undefined
                    var childHTML = $(div + ":first-child").html();
                    console.log(childHTML);
                    if(childId != null){
                        console.log("Child id "+ childId);
                        if(count = childId){
                            correctPositions++;
                            console.log("Correct answers:"+correctPositions);
                        }
                    } else {
                        console.log("child is undefined");
                    }
                }
                console.log("end of IF");
            }

            //Bind click to function
            $("#goed").click(function() {
                //Loops 4 times
                for(count = 1; count < 5; count++) {
                    handleForm(count);
                }                   
            }); 
        });

当所有拼图都在正确的位置时，这是HTML。

                <div id="pieceHolder">
                    <div class="position one ui-droppable" id="1A"><span style="display:none;" id="1">1</span></div>
                    <div class="position two ui-droppable" id="2A"><span style="display:none;" id="2">2</span></div>
                    <div class="position three ui-droppable" id="3A"><span style="display:none;" id="3">3</span></div>
                    <div class="position four ui-droppable" id="4A"><span style="display:none;" id="4">4</span></div>
                </div>

第一个div很好，它找到子跨度及其ID。只有当我到达第二个div时，它仍然会找到父div，但是说没有孩子，因此，找不到任何拼图。我错过了什么？

Answer 1

已经提到过，您不应该使用数字来启动ID。但是，例如，假设该数字为4。然后是以下一行：

var childId = $(div + ":first-child").attr("id");

将是：

var childId = $("#4A:first-child").attr("id");

这不是指#4A的第一个孩子，如果这是你的意图。 #4A已经返回一个元素;因此，当您追加:first-child时，返回的集合将为空，因为#4A不是它的父级first-child。

可能是你打算写的：

var childId = $(div).children("span:first-child").attr("id");

1循环（变量）后jQuery var undefined

1 个答案: