Fatal编程技术网
  • javascript/
  • Javascript 为什么这个文本效果不起作用？

Javascript 为什么这个文本效果不起作用？

javascript

Javascript 为什么这个文本效果不起作用？,javascript,Javascript,我正在尝试从修改脚本以处理多个跨度 我已经试过了，但它似乎用相同的文本覆盖了两个跨距 <html> <head> <script> var got; var chars; function change(decSpan,encSpan) { var randstring = ""; var rslength = chars.length - got.length; var decrypted = document.getElementBy

我正在尝试从修改脚本以处理多个跨度

我已经试过了，但它似乎用相同的文本覆盖了两个跨距

<html>
<head>
<script>
var got;
var chars;

function change(decSpan,encSpan)
{
   var randstring = "";
   var rslength = chars.length - got.length;

   var decrypted = document.getElementById(decSpan);
   var encrypted = document.getElementById(encSpan);

   for(var x=0;x<rslength;x++)
   {
       i = Math.floor(Math.random() * chars.length);
       randstring += chars.charAt(i);
   }

   if(randstring.charAt(0) == chars.charAt(got.length))
   {
      got += randstring.charAt(0);
      decrypted.innerHTML = got;
   }
   else
   {
      encrypted.innerHTML = randstring;
   }

   if(chars.length > got.length)
   {
  setTimeout("change('"+decSpan+"','"+encSpan+"')", 10);
   }
   else
   {
      encrypted.innerHTML = "";
   }
}
function startdecrypt()
{
   var decodeSpans = ["decoded","decoded2"];
   var encodeSpans = ["encoded","encoded2"];
   for(var z in decodeSpans) 
   {
decSpan = decodeSpans[z];
encSpan = encodeSpans[z];
    var decrypted = document.getElementById(decSpan);
    var encrypted = document.getElementById(encSpan);

    chars = decrypted.innerHTML;
    decrypted.innerHTML = "";
    got = "";
    setTimeout("change('"+decSpan+"','"+encSpan+"')", 10);
   }
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<input type="button" value="go" onClick="javascript:startdecrypt()"><br>
<span id="decoded">Test1</span><span id="encoded"></span><br>
<span id="decoded2">Test2</span><span id="encoded2"></span>
</body>
</html>


var-got；
var-chars；
功能更改（decSpan、encSpan）
{
var randstring=“”；
var rslength=chars.length-got.length；
var decrypted=document.getElementById（decSpan）；
var encrypted=document.getElementById（encSpan）；
对于（变量x=0；x得到的长度）
{
设置超时（“更改（“+decSpan+”，“+encSpan+”）”，10）；
}
其他的
{
encrypted.innerHTML=“”；
}
}
函数startdecrypt（）
{
var decodespands=[“decoded”，“decoded2”]；
var encodespan=[“encoded”，“encoded2”]；
for（变量z，单位为）
{
decSpan=decodeSpans[z]；
encSpan=encodespan[z]；
var decrypted=document.getElementById（decSpan）；
var encrypted=document.getElementById（encSpan）；
chars=decrypted.innerHTML；
decrypted.innerHTML=“”；
得到“”；
设置超时（“更改（“+decSpan+”，“+encSpan+”）”，10）；
}
}


测试1

测试2
问题在于该脚本使用全局javascript变量：
chars
和
got
在
startdecrypt
中设置，稍后在
change
函数中使用。因此，循环的下一次迭代将覆盖以前设置的值

最好的解决方案可能是将它们包含在
change
函数的js调用中，就像您对ids所做的那样

另外，请确保将所有js变量声明为本地变量，以避免此类副作用：
var get=”“

我承认没有通读您的全部代码，但您似乎无意中关闭了Javascript，如本例所示：

或者，正如Nikita所说，全局变量，当在
change（）
函数中引用它时，它就构成了一个闭包。请注意，for的
内的
var
不会改变任何内容。Javascript没有块作用域

请注意，在循环中使用
var
，或在函数顶部声明
var x
具有相同的效果。你可能想考虑使用<代码>让代替：




闭包很难理解，尤其是意外的闭包。Ender在上述链接上的回答包含了关于它们如何工作的有用链接。
如果我理解正确，这应该可以满足您的要求：


var decodeSpans = ["decoded", "decoded2"];
var encodeSpans = ["encoded","encoded2"];

function encoder(decSpan, encSpan){
    this.encSpan = encSpan;
    this.decSpan = decSpan;
    var got = "";
    var chars = decSpan.innerHTML;
    decSpan.innerHTML = "";
    return (function(){
        var randstring = "";
        var rslength = chars.length - got.length;

        for(var x=0;x<rslength;x++){
            i = Math.floor(Math.random() * chars.length);
            randstring += chars.charAt(i);
        }

        if(randstring.charAt(0) == chars.charAt(got.length)){
            got += randstring.charAt(0);
            decSpan.innerHTML = got;
        }else{
            encSpan.innerHTML = randstring;
        }

        if(chars.length > got.length){
            decSpan.innerHTML = chars;
            encSpan.innerHTML = "";
        }else{
            encSpan.innerHTML = "";
        }
    })();
}

function startdecrypt(){
    for(var z = 0; z < decodeSpans.length; z++){
        decSpan = decodeSpans[z];
        encSpan = encodeSpans[z];
        var decrypted = document.getElementById(decSpan);
        var encrypted = document.getElementById(encSpan);
        encoder(decrypted, encrypted);
    }
}



var decodeSpans=[“decoded”，“decoded2”]；
var encodespan=[“encoded”，“encoded2”]；
功能编码器（decSpan、encSpan）{
this.encSpan=encSpan；
this.decSpan=decSpan；
var-got=“”；
var chars=decSpan.innerHTML；
decSpan.innerHTML=“”；
返回（函数（）{
var randstring=“”；
var rslength=chars.length-got.length；
对于（变量x=0；x得到的长度）{
decSpan.innerHTML=chars；
encSpan.innerHTML=“”；
}否则{
encSpan.innerHTML=“”；
}
})();
}
函数startdecrypt（）{
对于（var z=0；z


我只是在两天前才正确地阅读了闭包，所以我仍然试图将其全部放在上下文中，所以对于这个解决方案的一些（建设性的）反馈将受到了解这些事情的人的欢迎：）
单击按钮时，文本会随机更改，但仍然使用原始文本中的所有字符。如果这是你想要的，它对我很有用。“不工作”是什么意思？