gpt4 book ai didi

javascript - 使用 JQuery 选择最后添加的元素

转载 作者:行者123 更新时间:2023-12-02 18:21:15 24 4
gpt4 key购买 nike

所以我有一段简单的代码。没有什么严重的,或者危及生命的。我只是尝试使用 JavaScript 通过单击创建的最后一个元素来使用一些基本的 100x100 元素填充一个空的 html 文件。问题是:我实际上无法让我的代码注册创建的最后一个元素,只能注册最后一个初始元素。我可能做错了什么?

<!DOCTYPE html>
<html>
<head>
<title>Container Rainbow</title>
<style type="text/css">
div{ width:100px;height:100px; }
#head{ background-color:rgba(100,0,100,.8);}
#wrapper{width:100%;height:auto;}
div#wrapper > div{float:left;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var lastDiv;
var rgba = new Array();
rgba[0] = 110; rgba[1] = 0; rgba[2] = 110; rgba[3] = 1;
$(document).ready(function(){
lastDiv = $("div").last();
lastDiv.on("click", function(){
rgba[0] += 5;
rgba[2] += 5;
var newDiv = $("<div></div>")
.addClass("hatchling")
.css("background-color", "rgba("+rgba[0]+",0,"+rgba[2]+",1)")
$(this).after(newDiv);
lastDiv=newDiv;
});
});
</script>
</head>
<body>
<div id="wrapper">
<div id="head"></div>
</div>
</body>
</html>

最佳答案

这是您可以使用的代码和 jsfiddle 演示其工作原理 http://jsfiddle.net/krasimir/K2dyd/

var lastDiv;
var rgba = new Array();
rgba[0] = 110; rgba[1] = 0; rgba[2] = 110; rgba[3] = 1;

var divClick = function() {
rgba[0] += 5;
rgba[2] += 5;
var newDiv = $("<div></div>")
.addClass("hatchling")
.css("background-color", "rgba("+rgba[0]+",0,"+rgba[2]+",1)")
$(this).after(newDiv);
lastDiv.off("click");
lastDiv=newDiv;
lastDiv.on("click", divClick);
}

lastDiv = $("div").last();
lastDiv.on("click", divClick);

这个想法是将onclick事件附加到最新的div。在代码中,您创建 div 并将其分配给 lastDiv,但没有附加事件处理程序。

关于javascript - 使用 JQuery 选择最后添加的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18806820/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com