为什么此文本效果不起作用？
[英]Why is this text effect not working?
问题描述
我正在尝试从此处修改脚本以在一个以上跨度上工作。
我已经尝试过了，但是似乎用相同的文本覆盖了两个范围。
<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>
3 个解决方案
解决方案1
2 2010-07-18 16:29:04
问题在于该脚本使用全局javascript变量： chars和got在startdecrypt中设置，以后在change函数中使用。 因此，循环的下一次迭代将覆盖先前设置的值。
最好的解决方案可能是将它们包括在change功能的js调用中，就像使用id一样。
另外，请确保将所有js变量声明为本地，以避免产生此类副作用： var got = "" 。
解决方案2
0 2010-07-18 16:40:46
我承认您不会遍历整个代码，但是似乎您做了一个意想不到的Java脚本关闭，如以下示例所示：
或者，正如Nikita所说的，全局变量，当在change()函数中引用该全局变量时，它会闭合。 请注意， for中的var不会更改任何内容。 Javascript没有块范围。
请注意，在循环内部使用var或在函数顶部声明var x具有相同的效果。 您可能要考虑使用let代替：
关闭是很难理解的，尤其是意想不到的。 Ender在上面链接上的答案提供了有关其工作方式的有用链接。
解决方案3
0 2010-07-18 17:22:46
如果我正确理解，这应该可以满足您的需求：
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);
}
}
我只在2个晚上之前正确地阅读了闭包，因此仍在尝试将它们全部放在上下文中，因此，那些了解这些事情的人都欢迎对此解决方案提供一些（建设性）反馈：）
jQuery文本效果不起作用
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.