使用$ {document）.ready（function（）嘗試運行此jquery / javascript代碼的頁面將無法加載

Question

Etch-a-sketch js ：（此代碼中也使用了jquery）

// Function for creating a grid, num is designate rows + columns

function createGrid(num) {
    for (var rows=0; rows < num; columns++) {
        for (var columns=0; columns < num; columns++) {
            $('#container').append("<div class='grid'></div");
        }        
    }

    $('.grid').width(960/num);
    $('.grid').height(960/num);
}

// Function to clear grid

function gridClear() {
     $('.grid').remove();
}

// Function to refresh grid and ask for new grid dimension

function refreshGrid() {
    var dime = prompt("Choose your new dimensions");
    gridClear();
    creatGrid(dime);
}

以下是用於在頁面加載時創建16x16網格，懸停效果以更改正方形顏色以及單擊按鈕以刷新網格並詢問新尺寸的代碼。

$(document).ready(function () {

    createGrid(16);

    $('.grid').mouseover(function() {
        $(this).css('background-color','black');
    });

    $('.but').click (function () {
        refreshGrid();  
        $('.grid').mouseover(function() {
            $(this).css('background-color','black');
        });    
    });
});

Answer 1

這是導致問題的部分：

for (var rows=0; rows < num; columns++)

您的循環永遠不會結束，因為您不會增加rows 。