我在Java脚本中有五十个句子作为var短语数组。单击按钮即可随机选择它们。我希望同一个按钮也可以对这些var短语数组语句显示typewritter效果，而不是一次，但是能够在下次单击时重新启动或重置。不知道如何在js句子上应用这种效果？
我尝试在CSS中执行typewritter效果，不起作用
链接到代码> https://codepen.io/karolis-rusevicius/pen/vvpJLw
<button class="b" onclick="completeSentence(phraseArray, 'randomAdjective')"><span >Talk</span></button>
<p id="randomAdjective" class="label label-success"><blink>_</blink>`</p>`
function PickRandomWord(frm) {
// Generate a random number between 1 and NumberOfWords
var rnd = Math.ceil(Math.random() * NumberOfWords)
// Display the word inside the text box
frm.WordBox.value = words[rnd]}
var phraseArray = [
"Androids dream of electric sheep at the incubators<blink>_</blink>",
"Robot will feed you tomatoes while you run<blink>_</blink>",
"Just like the simulations<blink>_</blink>",
"Read the manual while farming<blink>_</blink>",
"Just Quick and easy hardware muffin with electric simulations on top<blink>_</blink>",
"I thought bitmap asteroids would fit here<blink>_</blink>",
"In this world virtual reality is created for laboratory animals<blink>_</blink>",
"Cyborg bacteria outperforms digital pigeons at farming funny jokes<blink>_</blink>",
"Bacteria recognition systems are virtual, just like reality<blink>_</blink>",
"Simulations are created for neural patterns<blink>_</blink>",
"new software update is available! At our laboratory<blink>_</blink>",
"We have updated our privacy policy, please accept it at our neural laboratory<blink>_</blink>",
"By accepting our policy, you agree to our upgraded terms and androids<blink>_</blink>",
"My hardware feed the digital software<blink>_</blink>",
"My computers run all the simulations<blink>_</blink>",
"The sky is very #6698FF today<blink>_</blink>",
"Here are bitmap asteroids spilled all over the reality<blink>_</blink>",
"The created robot entered the cyborg forest<blink>_</blink>",
"Androids skin is soft as rubber soft gets, just like humanoid rubber<blink>_</blink>",
"I will fit in this humanoid tisue, no cyborg bacteria can attack me while I wear it.<blink>_</blink>",
"Would you consider donating your hardware ? It can save meany robot lives<blink>_</blink>",
"Humanoid software is fit for farming, bitmap asteroids dont lie.<blink>_</blink>",
"We have created a new policy, no pants are allowed in our reality. All users will degrade to digital pigeons<blink>_</blink>",
"Pigeons fly, but in digital reality, they run the marathons<blink>_</blink>",
"Electric squirrels are demaging our neural software while they feed on our cyborg bacteria<blink>_</blink>",
"Humanoid beeings are sickly. I mean you are fragile, we need to run you throught neural laboratory<blink>_</blink>",
"Do animals fly throught bitmap arcks?<blink>_</blink>",
"The new policy allows farming on the outskirts of humanoid laboratory<blink>_</blink>",
"How is your hardware ? You can replace it at our world<blink>_</blink>",
"You know, the robot behind you is just recording.<blink>_</blink>",
"Asteroids...ahhh. If only I could infuse them with pigeons...<blink>_</blink>",
"Dont assume cyborg hardware<blink>_</blink>",
"To be virtual bacteria or not to be?<blink>_</blink>",
"Upgraded androids prooved. Simulations can exist in virtual world<blink>_</blink>",
"Here is a joke for you: what do you call a robot without tea? A robo<blink>_</blink>",
"Today it is bitmap world day!! Happy bitmaping!<blink>_</blink>",
"While I run the policy of million'o'muffins a day, you can have one<blink>_</blink>",
"Pigeons have updated software<blink>_</blink>",
"If I get elected, asteroids will have rights to fly above<blink>_</blink>",
"Virtual computers like compliments<blink>_</blink>",
"I should go back to farming digital protons...<blink>_</blink>",
"Shlugs would like to have some spare electric rods<blink>_</blink>",
"Here we feed neural computers<blink>_</blink>",
"teach computers how to eat and they will feed them selfs<blink>_</blink>",
"I have created electric metal brush, keeps your metal fresh<blink>_</blink>",
"In this world it is posible for computers to achieve motherhood<blink>_</blink>",
];
function randomIndex(arr){
return Math.floor((Math.random() * arr.length));
}
function completeSentence(arr, loc){
index = randomIndex(arr);
document.getElementById(loc).innerHTML = arr[index];
}
答案 0 :(得分：1)
您想要像这样的Codepen吗？
添加了以下代码段：
function completeSentence(arr, loc){
index = randomIndex(arr);
var str = arr[index];
for(let i=0; i<str.length; i++){
setTimeout(function(){
document.getElementById(loc).innerHTML = str.substr(0,i);
},500+i*80);
}