recherche

Maison  >  Questions et réponses  >  le corps du texte

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 ?

<!--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>

怪我咯怪我咯2824 Il y a quelques jours552

répondre à tous(4)je répondrai

  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-19 10:18:52

    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

    répondre
    0
  • PHP中文网

    PHP中文网2017-05-19 10:18:52

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

    répondre
    0
  • 某草草

    某草草2017-05-19 10:18:52

    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);
    }
}

    répondre
    0
  • 怪我咯

    怪我咯2017-05-19 10:18:52

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

    répondre
    0
  • Annulerrépondre