所以我很高興我從以前的問題中獲得了這張表的幫助;但我遇到了另一個問題。單詞生成器適用於該工具的方式是使用math.random從1-9生成一個隨機數,然後用math.floor將其舍入。然後,這個代碼的function changeRandom()
方面抓住這個數字,並根據該數字將數字改爲一個隨機單詞,這樣如果生成的隨機數是3,它就會變成Word 3.現在,我試着去做答案是一樣的,但似乎沒有改變。只有調試控制檯給我的錯誤是gen_nums沒有爲getRandomAnswer()
定義,但是當我刪除它時,處理+需要更長的時間,或者有關於最大文件空間的錯誤或其他信息。我需要對單詞選擇器功能做類似的處理以適用於9個框。這是代碼。div innerHTML重寫失敗
注意:代碼中的註釋/註釋可以忽略,因爲它們僅供參考。
HTML
<div id="randomizer">
<div id="wordOutput">
<div id="output">
<p id="outputNumber"></p>
</div>
<div id="button">
<!-- This is the button that calls the getRandom() function to create the word. --><button id="myBtn">Randomize!</button><br>
<caption>Click this button to generate a random word!
</caption>
<!-- This is apart of the Randomizer tool, which can be changed to fit the words. It will output the answers based on -->
<div id="answers">
<div class="output1" id="output1"></div>
<div class="output2" id="output2"></div>
<div class="output3" id="output3"></div><br>
<div class="output4" id="output4"></div>
<div class="output5" id="output5"></div>
<div class="output6" id="output6"></div><br>
<div class="output7" id="output7"></div>
<div class="output8" id="output8"></div>
<div class="output9" id="output9"></div>
</div>
</div>
的JavaScript
/*function playSound() {
}
*/
/* This section is for the first tool; the Randomizer.*/
/* This is the new function for getting a random number; also used in the getRandomAnswer() function. To select different numbers, adjust the range. */
function getRandom() {
var nums = [1,2,3,4,5,6,7,8,9];
var gen_nums = [];
function in_array(array, el) {
for(var i = 0 ; i < array.length; i++)
if(array[i] == el) return true;
return false;
}
function get_rand(array) {
var rand = array[Math.floor(Math.random()*array.length)];
if(!in_array(gen_nums, rand)) {
gen_nums.push(rand);
return rand;
}
return get_rand(array);
}
for(var i = 0; i < 9; i++) {
return (get_rand(nums));
}
}
function timeOut(){
/* This can be ignored, as it was a testing function for creating, making, and fixing the randomizer tool, but may change based on creating new tools that need to be troubleshooted. */
setTimeout (changeRandom, 1);
}
/* This is the function that grabs the innerHTML (what the box says) of the #output1 and changes that number to the word specified. [In example, if the number [randomly] generated was 5, then this function detects that the number was 5 and changes it to Word 5.] */
function changeRandom() {
/* Using the "var x" command, this tells the function that whenever there's an x in the code, it will read it as "document.getElementById('output1').innerHTML", and will grab whatever is inside that #output1 element. */
var x = document.getElementById('outputNumber').innerHTML
/* Here's the tutorial for modifying this tool for the possible answers. This tool [by default] has it set to */
if(x == 1) {
document.getElementById("outputNumber").innerHTML = "Word 1";
} else if(x == 2) {
document.getElementById("outputNumber").innerHTML = "Word 2";
} else if(x == 3) {
document.getElementById("outputNumber").innerHTML = "Word 3";
} else if(x == 4) {
document.getElementById("outputNumber").innerHTML = "Word 4"
} else if(x == 5) {
document.getElementById("outputNumber").innerHTML = "Word 5"
}
else if(x == 6) {
document.getElementById("outputNumber").innerHTML = "Word 6"
}
else if(x == 7) {
document.getElementById("outputNumber").innerHTML = "Word 7"
}
else if(x == 8) {
document.getElementById("outputNumber").innerHTML = "Word 8"
}
else if(x == 9) {
document.getElementById("outputNumber").innerHTML = "Word 9"
}
else if(x == 10) {
document.getElementById("outputNumber").innerHTML = "Word 10"
}
/* If the function is broken [by user modifications], it will output "Error :c", which means the user should check their modifications. */
else {
document.getElementById("output1").innerHTML = "Error :c"
}
}
document.getElementById("myBtn").addEventListener("click", function(){document.getElementById("outputNumber").innerHTML = getRandom(); changeRandom();})
function testFunction() {
if(document.getElementById("output1").innerHTML == 3) {
document.getElementById("output1").innerHTML = "Three";
}
else {
document.getElementById("output1").innerHTML = "N3"
}
}
function getRandomAnswer() {
var nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var copy = nums.slice();
for (var i = 0, len = nums.length; i < len; i++) {
var j = Math.floor(Math.random() * copy.length);
var rand = copy[ j ];
// remove from array
copy.splice(j, 1);
// add to output
document.getElementById('output' + (i + 1)).innerHTML = rand;
}
return gen_nums;
document.getElementById('output' + (i + 1)).innerHTML = getRandomAnswer();
}
function changeRandomAnswer() {
/* Using the "var x" command, this tells the function that whenever there's an x in the code, it will read it as "document.getElementById('output1').innerHTML", and will grab whatever is inside that #output1 element. */
/* Here's the tutorial for modifying this tool for the possible answers. This tool [by default] has it set to */
if(document.getElementById("output1").innerHTML = "1") {
document.getElementById("output1").innerHTML = "Answer 1";
}
else if(document.getElementById("output1").innerHTML = "2") {
document.getElementById("output2").innerHTML = "Answer 2";
}
else if(document.getElementById("output1").innerHTML = "3") {
document.getElementById("output3").innerHTML = "Answer 3";
}
else if(document.getElementById("output1").innerHTML = "4") {
document.getElementById("output4").innerHTML = "Answer 4"
}
else if(document.getElementById("output1").innerHTML = "5") {
document.getElementById("output5").innerHTML = "Answer 5"
}
else if(document.getElementById("output1").innerHTML = "6") {
document.getElementById("output6").innerHTML = "Answer 6"
}
else if(document.getElementById("output1").innerHTML = "7") {
document.getElementById("output7").innerHTML = "Answer 7"
}
else if(document.getElementById("output1").innerHTML = "8") {
document.getElementById("output8").innerHTML = "Answer 8"
}
else if(document.getElementById("output1").innerHTML = "9") {
document.getElementById("output9").innerHTML = "Answer 9"
}
/* If the function is broken [by user modifications], it will output "Error :c", which means the user should check their modifications. */
else {
document.getElementById("output1").innerHTML = "Error :c"
}
}
document.getElementById("myBtn").addEventListener("click", function(){document.getElementById("answers").innerHTML = getRandomAnswer(); changeRandomAnswer();})
這裏是一個可行的codepen的工作。
謝謝,我會爲codepen使用投票,但..代表不是15:P – 2014-11-21 20:35:19