2016-03-09 68 views
0

今天我試圖讓文本冒險出現在像我爲MadLibs做的那樣的「畫布」中,但我似乎無法使它一次顯示一行,或者找到讓用戶點擊某些內容以顯示下一行的方法。另一個問題是當一個選項出現時該怎麼做,所以如果有人正在閱讀本文並知道如何解決此問題:請參閱我目前在my website上所做的工作。如何讓JavaScript一次只運行一個字符串

目前我只是有一個功能,按順序運行一堆警報(故事的每一行),然後確認並提示框以供用戶做出決定。這不是非常用戶友好的,我希望文本使用.innerHTML之類的東西出現,但我不知道如何使用它。

See here for the code behind the function.

function theElderwood1() { 
 
    alert("THE ELDERWOOD: EPISODE I by Kiran Evans"); 
 
    var conf = confirm("Play this game?"); 
 
    if (conf === false) { 
 
    return; 
 
    } else { 
 
    alert("Let's go!"); 
 
    }; 
 
    alert("It was a dark and stormy night, when a mouse stirred in the woods. You check your watch, it's nearly midnight... and you are lost."); 
 
    alert("You came here for a stroll, but that was at 5pm and the Sun was still up. Now everything is pitch black and the only light is coming from the Moon and stars."); 
 
    var torchSearch = confirm("Do you want to search your bag for a torch?"); 
 
    if (torchSearch === true) { 
 
    alert("You search your bag and find a torch, with very low battery power."); 
 
    alert("You shine the torch ahead of you, and notice that the path forks into two."); 
 
    } else { 
 
    alert("You don't search your bag, and have to deal with the lack of natural light."); 
 
    alert("After walking a little while, you can just about make out that the path forks into two.") 
 
    }; 
 
    var pathChoice = prompt("Do you want to take the left or right fork? (Type 'L' or 'R')"); 
 
    if (pathChoice.toUpperCase() === 'L') { 
 
    alert("You take the left path, and continue walking."); 
 
    alert("You eventually come across a stream."); 
 
    if (torchSearch === true) { 
 
     alert("You shine the torch into it and see that the stream is running very fast, and is too deep to wade through."); 
 
    } else { 
 
     alert("You cannot tell how fast or how deep it is, so you try to wade through."); 
 
     alert("Half way across, you sink into the stream which has become a river and cannot escape. You get swept under and cannot breathe."); 
 
     alert("You drowned."); 
 
     return; 
 
    }; 
 
    alert("You decide to turn back and take the right path."); 
 
    } else { 
 
    alert("You take the right path, and continue walking."); 
 
    }; 
 
    alert("Down the right path, you come across a small construction of sticks and twigs."); 
 
    var wigwamSearch = confirm("Do you want to look inside?"); 
 
    if (wigwamSearch === true) { 
 
    if (torchSearch === true) { 
 
     alert("You shine your torch into it, and a small goblin-like creature lashes out at you."); 
 
     alert("Hitting it with the torch, you manage to fight it off and it hobbles back into its lair."); 
 
    } else { 
 
     alert("You poke your head inside to get a better look and can just about make out a pair of glowing red eyes right in your face."); 
 
     alert("Whatever the creature is, you can hear it breathing and it begins to shriek."); 
 
     alert("The creature screams, lashes out and attacks you. You have nothing to fight it with, so have to use your fists."); 
 
     alert("You manage to fight it off eventually, but not without some extreme injuries. You are bleeding heavily from your neck, where the creature has bitten you."); 
 
     alert("The scent of your blood attracts more of the creatures."); 
 
     var run = confirm("Do you want to run?"); 
 
     if (run === true) { 
 
     alert("You get back on your feet and start running..."); 
 
     alert("...but it's not enough. The creatures outnumber you, though you can't see how many there are."); 
 
     alert("They overpower you and devour you. You died."); 
 
     return; 
 
     } else { 
 
     alert("You sit back and await your approaching doom."); 
 
     alert("The creatures surround you and tear you to pieces. You died."); 
 
     return; 
 
     }; 
 
    }; 
 
    } else { 
 
    alert("You decide not to look inside the structure and continue walking."); 
 
    }; 
 
    alert("Your legs begin to feel tired, so you check your watch. It is now 30 minutes into the morning. You know you must find a way out of the woods soon as you are feeling tired and hungry."); 
 
    alert("You hear rustling behind you and spin round..."); 
 
    if (torchSearch === true) { 
 
    alert("You point your torch at the noise and a fleck of white catches your eye in the blackness of the night."); 
 
    alert("You move your torch about and more patches of white appear until they start to form the shapes of creatures."); 
 
    alert("One of the creatures emerges from the darkness onto the path from where you just came."); 
 
    alert("It is small, not much higher than your waist, and has bright red eyes. Its skin is inexplicably pale and scarred in several places."); 
 
    alert("More creatures step out into the torchlight and slowly begin hobbling towards you."); 
 
    var runFrom = confirm("Do you want to run?"); 
 
    if (runFrom === true) { 
 
     alert("You turn away from them and begin to pick up your pace, going from a walk to a jog and eventually into a sprint."); 
 
     alert("Despite your incredible speed, you can hear the creatures close behind at all times."); 
 
     alert("You feel the ground under your feet change from soft soil to hard rock."); 
 
     var checkSurroundings = confirm("The creatures are still hot on your heels. Do you want to pause to check out your surroundings?"); 
 
     if (checkSurroundings === true) { 
 
     alert("You slow down, shining your torch around and notice a cliff edge up ahead. You notice how you are now on top of a cliff, in an open space."); 
 
     alert("You quickly change direction and begin running parallel to the cliff edge."); 
 
     } else { 
 
     alert("You pick up the pace, set on the path ahead...."); 
 
     alert("...which suddenly disappears from underneath you."); 
 
     alert("You are falling..."); 
 
     alert("...for ever..."); 
 
     alert("...until you hit the floor."); 
 
     alert("You died."); 
 
     return; 
 
     }; 
 
    } else { 
 
     alert("You stay put, observing the creatures as they approach. Keeping the torchlight fixed on them, your hands begin to shake as you notice the closer ones gnashing their teeth."); 
 
     alert("Frozen in fear, you begin to sweat as the first creature reaches you and sniffs you."); 
 
     alert("The creature jumps onto you, knocking you to the ground and licks your face."); 
 
     alert("The others surround you and the one on top of you bites your neck."); 
 
     alert("You scream in pain as the creatures eat you alive."); 
 
     return; 
 
    }; 
 
    } else { 
 
    alert("You cannot make out anything behind you, dismissing it as your imagination."); 
 
    alert("You feel the ground under your feet change from soft soil to hard rock."); 
 
    alert("You pick up the pace, set on the path ahead...."); 
 
    alert("...which suddenly disappears from underneath you."); 
 
    alert("You are falling..."); 
 
    alert("...for ever..."); 
 
    alert("...until you hit the floor."); 
 
    alert("You died."); 
 
    return; 
 
    }; 
 
    alert("The cliff eventually becomes a road and you hear the creatures behind you scream with anger as you reach a lamp post and are safely in the light."); 
 
    alert("You can see the lights of a town ahead of you, and head for them."); 
 
    alert("You check your watch. The time is now 1am. You're feeling extremely fatigued and don't know if you can make it to the next town."); 
 
    var sit = confirm("There is a bench beside the road. Do you want to sit down, and rest?"); 
 
    if (sit === true) { 
 
    alert("With the creatures well out of reach, you take a seat on the bench and close your eyes."); 
 
    } else { 
 
    alert("You decide to soldier on until you reach the town."); 
 
    alert("Unfortunately, you overestimated the capacity of your own stamina and collapse in the middle of the road and black out."); 
 
    }; 
 
    alert("END OF EPISODE I."); 
 
    var restart = confirm("Do you want to restart?"); 
 
    if (restart === true) { 
 
    theElderwood1(); 
 
    return; 
 
    } else { 
 
    scoreCount += 1; 
 
    score(1, 'theElderwood2'); 
 
    alert("UNLOCKED! The Elderwood: Episode II"); 
 
    return; 
 
    }; 
 
};

正如你所看到的,這是非常簡單的,不是很人性化與所有這些彈出窗口。任何關於此的幫助/建議將不勝感激!謝謝!

+0

歡迎來到所以 - 請包括您的代碼在問題中,而不僅僅是一個鏈接 –

+0

對不起,我現在這樣做。 – Sabrewolf

+0

這是相當長的,但我希望我解釋了這個問題...... – Sabrewolf

回答

0

以下是您需要的全球視圖,希望對您有所幫助!

  1. 如果您不太瞭解HTML,請參閱一些教程。不要害怕它,HTML甚至不是編程語言,而是一種標記語言,用於組織數據,比Javascript更容易。一旦你看到純粹的純HTML出現的時候,你也會想學習CSS。

  2. 您需要在某個地方寫入HTML頁面。在<body>內某個地方的<p>標籤將會很好。給它一個標識符,以便稍後可以輕鬆找回:<p id="story"></p>

  3. 您需要使用Javascript來定位在哪裏書寫。使用document.getElementById(id)

  4. 你在頁面中編輯的是文本,我不會推薦使用.innerHTML,即使它看起來更容易。你想創建一個文本節點,你可以用document.createTextNode(text)來完成。

  5. 一旦你有你的文本節點,並知道它的位置,只需使用element.appendChild(otherElement)。這裏的「元素」是由getElementById檢索的元素,而「otherElement」應該是創建的文本節點。

  6. 添加文字很好,但您也應該刪除它!當然,用紙莎草紙製作一個漂亮的面板的滾動條會很好,但首先要研究如何使用element.removeChild刪除上一行的文本。這裏有很多步驟,但我不知道你對JavaScript有多少了解,所以也許你會好起來的,或者這可能是另一個StackOverflow問題?

  7. 一旦這一切工作正常,你會想用<button> s到更換您的通話confirm(),也許添加文本<input>區發問的球員,但是這是這個問題的範圍。

祝你好運!