我正在尝试构建一个标签云:当我点击一个标签时，所需的函数会运行 3 次，如 3,2,1 或 2,1，而不是只运行一次。 这在 jquery 版本和普通 js 上都会发生。我缺少什么？ 这是一个非常简单的代码，我坚持使用它:
.cloud .weight-1 { font-size: 10px; }
.cloud .weight-2 { font-size: 25px; }
.cloud .weight-3 { font-size: 35px; } <!DOCTYPE html>
<html>
<head>
<title>Exercise</title>
<link rel="stylesheet" type="text/css" href="2.css">
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
</head>
<body>
<div class="cloud">
<div id="firstword" class="weight-1" onclick="func1()">Cloud1</a>
<div id="secondword" class="weight-2" onclick="func2()">Cloud2</a>
<div id="thirdword" class="weight-3" onclick="func3()">Cloud3</a>
</div>
<div>
<foo class="bar">
<foo id="ba"></foo>
</foo>
</div>
<script type="text/javascript">
$(function()
{
$("#firstword").click(function()
{
alert("first.");
});;
$("#secondword").click(function(){
alert("second.");
});;
$("#thirdword").click(function(){
alert("third.");
});;
});
/*function func3(){
alert("3");
};
function func1(){
alert("1");
}
;
function func2(){
alert("2");
};*/
</script>
</body>
</html>最佳答案
您收到此错误是因为您没有正确关闭 div。
你需要这样做:
<div class="cloud">
<div id="firstword" class="weight-1" onclick="func1()">Cloud1</div>
<div id="secondword" class="weight-2" onclick="func2()">Cloud2</div>
<div id="thirdword" class="weight-3" onclick="func3()">Cloud3</div>
</div>
这是一个 jsFiddle 来显示这就是您需要更改的全部 - https://jsfiddle.net/eyd5b0ku/
关于javascript - 为什么我的函数运行了 3 次？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48420260/