我有一个我希望增加的变量。如果我这样做,它可以正常工作:
var curTrial = 0;
function inc(x) {
x++;
return x;
}
function show () {
document.write(curTrial)
curTrial = inc(curTrial);
}
show();show();show();show()
这会产生0123
,符合预期/预期。
然而,如果我用按钮加一点点,它会表现得很奇怪。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
</head>
<body>
<div id="box" style="text-align:center">
<div id="startTrial">Press any key to start the next trial</div>
<button id="next"type="button">Submit</button>
</div>
<script>
var curTrial = 0;
function inc(x) {
x++;
return x;
}
function RunTrial() {
prompt(curTrial);
curTrial = inc(curTrial);
$('#box').show();
$("#next").click(function(f) { StartExperiment(); });
}
function StartExperiment() {
$('#box').show();
$("#next").click(function(f) { RunTrial(); });
}
StartExperiment()
</script>
</div>
</body>
</html>
现在,值仍然一次增加一个,但我希望每次按下按钮都会调用一次。相反,它似乎被称为上一次的两倍(一次,两次,四次,八次等)
答案 0 :(得分:1)
这是因为在RunTrial()
中,您拨打StartExperiment()
,这会在#next
按钮上添加一个新的点击监听器,因此每次点击它时,您都可以使用{{1}}。重新添加新的单击侦听器。如果您只是删除该行,您将看到它按预期工作(每次点击只有一个提示)。
答案 1 :(得分:1)
每次在函数RunTrial()和click
StartExperiment()
事件处理程序
<强> SLOUTION
$(document).ready
块。$("#next").unbind( "click" );
取消绑定事件。第一个是首选。
var curTrial = 0;
$(document).ready(function(){
$("#next").click(function(f) { RunTrial(); });
});
function inc(x) {
x++;
return x;
}
function RunTrial() {
prompt(curTrial);
curTrial = inc(curTrial);
$('#box').show();
$("#next").click(function(f) { StartExperiment(); });
}
function StartExperiment() {
$('#box').show();
}
StartExperiment();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
</head>
<body>
<div id="box" style="text-align:center">
<div id="startTrial">Press any key to start the next trial</div>
<button id="next"type="button">Submit</button>
</div>
</div>
</body>
</html>
答案 2 :(得分:0)
var curTrial = 0;
function inc(x) {
x++;
return x;
}
function RunTrial() {
curTrial=prompt(curTrial);
curTrial = inc(curTrial);
$('#box').show();
$("#next").click(function(f) { StartExperiment(); });
}
function StartExperiment() {
$('#box').show();
$("#next").click(function(f) { RunTrial(); });
}
StartExperiment()
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
</head>
<body>
<div id="box" style="text-align:center">
<div id="startTrial">Press any key to start the next trial</div>
<button id="next"type="button">Submit</button>
</div>
</div>
</body>
</html>
答案 3 :(得分:0)
从runTrial()函数中删除$("#next").click(function(f) { StartExperiment(); });
。
你正在做的是每次调用RunTrial()时绑定一个click事件。
单击提交按钮,将触发runTrial函数的次数与绑定到它的点击事件的次数相同。
只需将事件绑定一次,每次单击按钮时它都会起作用