小编Pau*_*all的帖子

我有一个函数创建一个div网格,生成并在文档加载时发送到容器div.当一个人盘旋在div上时,他们突出显示(改变颜色).我有另一个重置网格的功能,允许用户指定网格的大小.它应该删除当前在容器div中的div,并用基于用户输入的div替换它们.据我所知,这是按预期工作的.那唯一不工作是悬停效果,一旦电网复位.任何帮助,或至少某些方向将非常感激.这是我的jsfiddle示例:http://jsfiddle.net/psyonix/1g9p59bx/45/

var d = ("<div class='square'></div>");

function createGrid(numSquares) {
    var area = $('#g_area');
    var squareSize = Math.floor(area.innerWidth() / numSquares);
    var n = 0;
    for (var i = 0, len = (numSquares * numSquares); i < len; i++) {
        area.append(d);
    }


    $('.square').height(squareSize);
    $('.square').width(squareSize);
}

function resetGrid() {
    $(".square").remove();
}

$(document).ready(function () {
    createGrid(32);

    $('.square').hover(

    function () {
        $(this).css({
            'background-color': '#FFFFFF'
        });
    }, function () {
        $(this).css({
            'background-color': '#C8C8C8'
        });
    });
    $("#button").click(function () {
        var numSquares = …

当我将鼠标悬停在它们上面时,我想要改变一个div网格.我试图让它变成白色,当鼠标不再悬停在它们上面时,它会变回灰色.我一直在寻找,我似乎无法找到解决我正在寻找的问题的答案.

var d = ("<div class='square'></div>");
var value = [];


function createGrid(numSquares) {
    var area = $('#g_area');
    var squareSize = Math.floor(area.innerWidth() /numSquares);
    var n =0;
    for (var i = 0, len = (numSquares*numSquares); i < len; i++) {
        area.append(d);
        for (var j = 0; j < numSquares; j++) {
            $(d).attr('id', n);
            n++;
            value[n] = 0;
        }
    }


    $('.square').height(squareSize);
    $('.square').width(squareSize);
};

function resetGrid() {
    $(".square").remove();
}

$(document).ready(function () {
    createGrid(32);

});

$('.square').hover(function() {
    $(this).css({backgroundColor: '#FFFFFF'}) ;
    $(this).css({backgroundColor: '#C8C8C8'}) ;
});

jsfiddle: …