2017-07-07 67 views
0

程序當前在開發工具中運行時沒有錯誤。除了代碼的最後部分外,所有內容都正在執行在提示中輸入輸入後,容器清除,但不會讓我用新設置的變量在內部繪製它?重新啓動我的電網迴路時出現問題

var row=16; 
var sizeofsquare=45; 

function gridLife() { 
    for (var x = 0; x < row; x++){ 
    for (var y = 0; y < row; y++){ 
    $("<div class='square'></div>").appendTo(".container"); 
} 
} 
} 

$(document).ready(function(){ 
    gridLife(); 
$('.square').on('mouseenter', function() { 
     $(this).css('background-color', 'black'); 
     }); 
}); 

$(document).ready(function(){ 
$('.buttons').click(function(){ 
    $('.container').empty(); 
    row = prompt ('How many sqaures would you like?'); 
    sizeofsquare = 720/row; 
}); 
}); 
+0

您可能需要將焦點放回要繪製的元素上。 – Difster

回答

0

問題是,您正在通過調用$('.container').empty()刪除所有方塊,但是之後沒有放回。在按鈕點擊處理程序結束時,應該再次調用gridLife()來重新生成網格元素。

但是,它仍然不起作用,因爲只有原始方形元素綁定了mouseenter事件。新廣場不再有這個事件處理程序。你可能通過再次打電話$('.square').on解決這個問題,但這很混亂。最好的辦法是使用可選的選擇參數.on(),像這樣:

$('.container').on('mouseenter', '.square', function() { 
    $(this).css('background-color', 'black'); 
}); 

現在,所有.square元素曾經.container元素中存在會自動觸發同樣的事件。

+0

你是男人。謝謝你的解釋。 –