简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Il y a un problème avec la simulation de l'effet de frappe informatique à l'aide de JS natif. Pourriez-vous m'aider s'il vous plaît ?
怪我咯
怪我咯 2017-05-19 10:16:52
0
4
483

<!--Veuillez copier et coller le code ci-dessous et exécutez-le dans le navigateur pour voir le problème-->
<!DOCTYPE html>
<html>
<head>

<meta charset='utf-8'>
<title>打字机效果</title>
<style> 
#main{ 
    border: 1px solid #ccc;
    height:100px;
    width:1000px;
}
</style>

</head>
<body>
<p id='main'></p>
<script type="text/javascript">
var context='Ce programme veut d'abord Entrez tout le texte un par un et supprimez tout le texte un par un après trois secondes. Cependant, après l'avoir exécuté, j'ai constaté qu'il serait à nouveau supprimé après la suppression. S'il vous plaît, aidez-moi, merci ! '
//console.log(a.length)
var contextLength=Number(0)
var writecontext=document.querySelector('#main')
function loop(){

return new Promise(function(sol,rej){ 
    function lop(){ 
        var t=setTimeout(function(){ 
            if(contextLength<context.length){ 
                writecontext.innerHTML=context.slice(0,contextLength++)+'_'
                lop()
            }
            else{ 
                if(contextLength=context.length){ 
                    setTimeout(function(){ 
                        clearTimeout(t)
                        sol(contextLength)
                    },3000)
                }
            } 
        },200) 
    }
    lop()
})

}

loop().then(function(value){

    function lp(){ 
        var n=setTimeout(function(){ 
            if(value>0){ 
                writecontext.innerHTML=context.slice(0,contextLength--)+'_'
                lp()
            }else{ 
                if(value<=0){ 
                    clearTimeout(n)
                }
            } 

        },50)
    }
    lp()

})
</script>
</body>
</html>

怪我咯
怪我咯

走同样的路，发现不同的人生

répondre à tous(4)
曾经蜡笔没有小新
曾经蜡笔没有小新2017-05-19 10:18:52 4 plancher

Le problème réside dans la fonction lp()

if(value>0){
   writecontext.innerHTML=context.slice(0,contextLength--)+'_'
   lp()
   }else{...}

Ce qui est jugé ici est la valeur mais l'opération est contextLength, donc la fonction lp() provoque une boucle infinie.

Expliquez la raison de la suppression deux fois : principalement la méthode slice()

'string'.slice(0,n);

Lorsque n est un nombre positif, il est exécuté dans l'ordre normal ; lorsque n est un nombre négatif, n sera remplacé par la longueur de la chaîne + n lors de l'exécution. Voir MDN pour plus de détails.
Ainsi, après la première exécution de lop() supprime la chaîne à 0, la contextLength continue de diminuer de un, entraînant deux suppressions visuelles

Comme +0
Ajouter une réponse
Ty80
Ty802017-05-19 10:18:52 3 plancher

Écrit par vouslp函数其实是无限循环函数来的，需要把lp函数下的contextLength--改为value--，且需要把value > 0改为value >= 0

Comme +0
Ajouter une réponse
某草草
某草草2017-05-19 10:18:52 2 plancher 
var context='这个程序是想先输逐个出所有文字，三秒钟以后逐个删除所有文字，但是运行以后发现删除到头又会重新删除一遍，请大神帮忙看看，谢谢！';

var contextLength=Number(0)
var writecontext=document.querySelector('#main')
var t1,t2;
t1 = setInterval('write()',100);
function write(){ 
    if(contextLength<=context.length){ 
        writecontext.innerHTML=context.slice(0,contextLength++)+'_'
    }
    else{
        clearInterval(t1);
        setTimeout(function(){
            t2 = setInterval('clear()',100);
        },1000);
    }
}
function clear(){
    if(contextLength>=0){
        writecontext.innerHTML=context.slice(0,contextLength--)+'_'
    }else{
        clearInterval(t2);
    }
}
Comme +0
Ajouter une réponse
刘奇
刘奇2017-05-19 10:18:52 1 plancher

Enregistrez les mots dans un tableau, puis ajoutez et supprimez le tableau

Comme +0
Ajouter une réponse
Sujets populaires
Plus>
Articles populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！