Javascript 单击按钮后无响应的元素

背景：

前几天我启动了Javascript，并创建了这个草图板：

以下是关于以下内容的说明：

问题：

它基本上已经完成了，除了使用“new”按钮创建新网格外，工作正常。突然，“广场”停止响应“悬停”事件。我已经搜索过了，但找不到任何类似的问题。有什么想法吗

代码：

$（文档）.ready（函数（）{
变量构建=函数（h，w）{
var高度=h；
var宽度=w；
//循环通过高度创建行
对于（i=1；i=50
如果（尺寸>50）{
$（“.row”）.remove（）；
建造（50，50）；
警报（“您输入的数字太大。已使用数字50。”）
}
//如果输入了非数字
其他如果（isNaN（尺寸））{
$（“.row”）.remove（）；
构建（16,16）；
警报（“您没有输入数字。已使用默认值16。”）
}
//如果数字改变
$（“.square”）。悬停（

到
$（document）.on（“hover”，“.square”，function（）{…}）
您在
$（“.square”）中遇到问题。悬停（
-在
$之后工作（文档）.ready
，但在添加新行之后-document ready not triggering，并且ur元素没有事件，并且trigger.on处理页面上的每个元素，即使是动态添加的元素。
您正在删除生成方法之前的div。这意味着将删除悬停侦听器。您必须再次将它们添加到.sqare元素中

快走

$(".square").hover(
//Mouse in
function () {
    $(this).css("background-color", "blue");
},
//Mouse out
function () {} );

在构建方法内部
我认为reading比$（document）干净得多。on….就像上面提到的'$（document）.on'需要添加一次-这就是为什么我建议这样做，但每个人都是自己编写代码的）我明白了！我不知道那些侦听器是“添加”的，我只是认为它们“存在”。谢谢！！@Frank Peelen我建议你阅读关于.on方法的内容，它与.click.hover等不同。发生的事情是，你在每个元素上添加了一个回调函数，该函数带有class.square，在触发悬停事件时调用->“侦听悬停”