太多递归了

Too much recursion

本文关键字:递归 太多      更新时间:2023-09-26

谁能告诉我这个循环是从哪里来的?

JS:

if (zahl > 1) {
    document.getElementById('makroclickm2').innerHTML = data_split[zahlm2];
    document.getElementById('makroclickm2').onclick = getwords(zahlm2++);
}
else {
    document.getElementById('makroclickm2').innerHTML = "";
    document.getElementById('makroclickm2').onclick = "";
}
if (zahl > 0) {
    document.getElementById('makroclickm1').innerHTML = data_split[zahlm1];
    document.getElementById('makroclickm1').onclick = getwords(zahlm1++);
}
else {
    document.getElementById('makroclickm1').innerHTML = "";
    document.getElementById('makroclickm1').onclick = "";
}
document.getElementById('makroclick').innerHTML = data_split[zahl];
document.getElementById('makroclick').onclick = getwords(zahl++);
document.getElementById('makroclickp1').innerHTML = data_split[zahlp1];
document.getElementById('makroclickp1').onclick = getwords(zahlp1++);
if (typeof(data_split[zahlp1]) == "undefined") {
    document.getElementById('makroclickp1').innerHTML = "";
    document.getElementById('makroclickp1').onclick = "";
}
document.getElementById('makroclickp2').innerHTML = data_split[zahlp2];
document.getElementById('makroclickp2').onclick = getwords(zahlp2++);
if (typeof(data_split[zahlp2]) == "undefined") {
    document.getElementById('makroclickp2').innerHTML = "";
    document.getElementById('makroclickp2').onclick = "";
}
HTML:

<div id="makroclickm2" onclick="" class="makroclick"></div>
<div id="makroclickm1" onclick="" class="makroclick"></div>
<div id="makroclick" onclick="getwords(0);" class="makroclick_center"></div>
<div id="makroclickp1" onclick="getwords(1);" class="makroclick"></div>
<div id="makroclickp2" onclick="getwords(2);" class="makroclick"></div>

(不完整的代码)onload函数只调用一次。

提前感谢!

在如下行中:

document.getElementById('makroclickm2').onclick = getwords(zahlm2++);

您将onclick处理程序分配给getwords(zahlm2++)结果,而不是分配给该函数本身。

如果,正如我猜测的那样,上面的代码实际上是getwords函数,这意味着它正在(递归地)调用自己。

相反,写:

document.getElementById('makroclickm2').onclick = function() {
   getwords(zahlm2++);
}

这并没有回答这个问题(甚至没有试图回答)。但是,它可以解决重复代码过多的问题。

// instead of repeating the document.getElementById
// many times over...
document.getElementById('makroclickm2').innerHTML = "";
document.getElementById('makroclickm2').onclick = "";
// get the element once
var elm = document.getElementById('makroclickm2')
// and use it many times over
elm.innerHTML = ""
elm.onclick = null // do not use strings here

这将使代码更容易理解(请使用合适的变量名)。

同样,不要将字符串onclick属性一起使用。用函数代替。

快乐编码。

您还可以考虑使用事件注册而不是直接分配。这样,您就不必担心以后会不小心覆盖任何内容。@Alnitak的解决方案看起来更像这样:

var myEl = document.getElementById('makroclickm2');
var myFunc = function() {
    getwords(zahlm2++);
}
if (myEl.addEventListener) myEl.addEventListener("click", myFunc, false);
else if (myEl.attachEvent) myEl.attachEvent("onclick", myFunc);
else myEl.onclick = myFunc;

显然,这是相当冗长的,但很容易编写一个快速的辅助函数,以myl和myFunc作为输入,并为您处理一切。

您可以在http://www.quirksmode.org/js/events_advanced.html上阅读更多关于事件注册的信息

这部分可能会给你带来一大堆问题:

if (zahl > 1) {
    document.getElementById('makroclickm2').innerHTML = data_split[zahlm2];
    document.getElementById('makroclickm2').onclick = getwords(zahlm2++);
}
else {
    document.getElementById('makroclickm2').innerHTML = "";
    document.getElementById('makroclickm2').onclick = "";
}
if (zahl > 0) {
    document.getElementById('makroclickm1').innerHTML = data_split[zahlm1];
    document.getElementById('makroclickm1').onclick = getwords(zahlm1++);
}
else {
    document.getElementById('makroclickm1').innerHTML = "";
    document.getElementById('makroclickm1').onclick = "";
}

尝试使用else if代替if语句块。此外,我将使用function(){}而不是""(和getwords(),因为它计算函数并且不将其设置为在调用偶数时运行):

if (zahl > 1) {
    document.getElementById('makroclickm2').innerHTML = data_split[zahlm2];
    document.getElementById('makroclickm2').onclick = function(){getwords(zahlm2++)};
} else if (zahl > 0) {
    document.getElementById('makroclickm1').innerHTML = "";
    document.getElementById('makroclickm1').onclick = null;
    document.getElementById('makroclickm1').innerHTML = data_split[zahlm1];
    document.getElementById('makroclickm1').onclick = function(){getwords(zahlm1++)};
} else {
    document.getElementById('makroclickm2').innerHTML = "";
    document.getElementById('makroclickm2').onclick = null;
}