JavaScriptを使用して描画した後の繰り返しは避けますか？

ボタンをクリックすると、8つの単語のうちの1つが表示されます。私は繰り返しを禁止する関数を書く方法が不思議だったので、単語は二度表示されません。何か案は？すべてのおかげでありがとう：JavaScriptを使用して描画した後の繰り返しは避けますか？

<!DOCTYPE html> 
<html> 
<head></head> 
<body> 
<button id= "go">go</button> 
<div id="word"></div> 

<script type="text/javascript"> 

var words = ["Michael", "Simon", "Peter", "Mark", "Jason", "Paul", "Steve", "George"]; 

var btn1 = document.getElementById("go"); 

btn1.addEventListener("click", fill_in); 

function getRandomItem(array) { 
return array[Math.floor(Math.random() * array.length)] 
} 

function fill_in(){ 
var randomWord = getRandomItem(words); 
document.getElementById('word').innerHTML += randomWord + " "; 
} 

</script> 
</body> 
</html>

出典

2016-12-19 wymyszony

あなたは方法getRandomItemをこのように書く必要があります。

function getRandomItem(array) { 
    return array.splice(Math.floor(Math.random() * array.length), 1)[0]; 
}

基本的には、表示後に要素を削除する必要があります。幸いにも、Array#spliceは、要素を削除してそれを含む配列を返すので、ケースに完全に合致します。

出典

2016-12-19 15:29:50 Lewis

これは私のために完全に<3 – wymyszony

繰り返されないように、返されるたびに配列から単語を削除することができます。 getRandomItemは 'Peter'を返しますので、getRandomItemを再度呼び出す前に 'words'配列から 'Peter'を削除します。

は、要素を削除するには、コードの下に使用することができます：

var words = ["Michael", "Simon", "Peter", "Mark", "Jason", "Paul", "Steve", "George"]; 
var index = words.indexOf("Peter"); 
if (index > -1) { 
    words.splice(index, 1); 
}

出典

2016-12-19 15:20:21

は、繰り返しを避けるために、それが画面上に表示された後、あなたは配列からnameを削除する必要があります。配列から名前を削除するには、単語のインデックスを見つけて、このインデックスの配列から1つのアイテムを削除する必要があります。このあなたがあなたのfill_in関数にこのコードを追加してrandomWordが配列から生成された後に、単語を削除する必要があり、次のコード

var word = words.indexOf(randomWord); 
if(word != -1) { 
    words.splice(i, 1); 
}

を使用する操作を行うに

。アレイが空になったら、画面への印刷を停止する必要があります。アレイが空であるかどうかを確認するには、配列wordsの長さを確認する必要があります。

function fill_in(){ 
    var randomWord = getRandomItem(words); 
    var word = words.indexOf(randomWord); 
    if(word != -1) { 
     words.splice(i, 1); 
    } 
    if(words.length != 0){ 
     document.getElementById('word').innerHTML += randomWord + " "; 
    } 
}

詳細については、下記を参照してください。

var words = ["Michael", "Simon", "Peter", "Mark", "Jason", "Paul", "Steve", "George"]; 
 
var btn1 = document.getElementById("go"); 
 
btn1.addEventListener("click", fill_in); 
 

 
function getRandomItem(array) { 
 
    return array[Math.floor(Math.random() * array.length)] 
 
} 
 

 
function fill_in() { 
 
    var randomWord = getRandomItem(words); 
 
    var i = words.indexOf(randomWord); 
 
    if (i != -1) { 
 
    words.splice(i, 1); 
 
    } 
 
    if(words.length != 0) { 
 
    document.getElementById('word').innerHTML += randomWord + " "; 
 
    } 
 
}

<button id="go">go</button> 
 
<div id="word"></div>

出典

2016-12-19 15:20:22

ありがとうたくさん:) – wymyszony

JavaScriptを使用して描画した後の繰り返しは避けますか？

答えて

関連する問題