简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - Terdapat masalah dengan mensimulasikan kesan menaip komputer menggunakan js asli, sila minta bantuan?
怪我咯
怪我咯 2017-05-19 10:16:52
0
4
484

<!--Sila salin dan tampal kod di bawah dan jalankannya dalam penyemak imbas untuk melihat masalah-->
<!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='Program ini mahu dahulu Masukkan semua teks satu demi satu, dan padam semua teks satu demi satu selepas tiga saat Namun, selepas menjalankannya, saya mendapati ia akan dipadamkan semula selepas dipadamkan. Tolong bantu saya, terima kasih. '
//console.log(a.length)
var contextLength=Nombor(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()
})

}

gelung().kemudian(fungsi(nilai){

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

        },50)
    }
    lp()

})
</skrip>
</body>
</html>

怪我咯
怪我咯

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

membalas semua(4)
曾经蜡笔没有小新
曾经蜡笔没有小新2017-05-19 10:18:52 Tingkat 4

Masalahnya terletak pada fungsi lp()

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

Apa yang dinilai di sini ialah nilai tetapi operasinya ialah contextLength, jadi fungsi lp() menyebabkan gelung tak terhingga.

Terangkan sebab pemadaman dua kali: terutamanya kaedah slice()

'string'.slice(0,n);

Apabila n ialah nombor positif, ia dilaksanakan dalam susunan biasa; apabila n ialah nombor negatif, n akan digantikan dengan panjang rentetan + n semasa pelaksanaan Lihat MDN untuk butiran.
Jadi, selepas pelaksanaan pertama lop() memadamkan rentetan kepada 0, contextLength terus berkurangan sebanyak satu, mengakibatkan dua pemadaman visual

Suka +0
Tambah Balasan
Ty80
Ty802017-05-19 10:18:52 Tingkat 3

ditulis oleh awaklp函数其实是无限循环函数来的，需要把lp函数下的contextLength--改为value--，且需要把value > 0改为value >= 0

Suka +0
Tambah Balasan
某草草
某草草2017-05-19 10:18:52 Tingkat 2 
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);
    }
}
Suka +0
Tambah Balasan
刘奇
刘奇2017-05-19 10:18:52 Tingkat 1

Simpan perkataan ke dalam tatasusunan, kemudian tambah dan padam tatasusunan

Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina：Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！