javascript - EDITED: I'm having issues with a button and its function -
-----edited----- story not being presented properly, again, due code error. need fresh eyes!
function story() { //collect users input data var transport = ""; var name = document.getelementsbyname("name")[0].value var title = document.getelementsbyname("title")[0].value var noun = document.getelementsbyname("noun")[0].value var num1 = document.getelementsbyname("num1")[0].value var num2 = document.getelementsbyname("num2")[0].value var travelmeasure = document.getelementsbyname("measureravel").value //write new html page display story document.write("<h1>"+title+"</h1>"); document.write("<p>once upon time,</p>"); document.write("<p>"+name+" trying make way "+noun+" in "+transport+".</p>"); document.write("<p>unfortunately "+name+" didn't realise how far away "+houn+" was.</p>"); document.write("<p>the assumption "+num1+" "+measuretravel+" when turned out "+num2+" "+measuretravel+".</p>"); document.write("<p>thankfully "+name+" likes travel.</p>"); document.write("<p>the end</p>"); } -----original-----
before adding "story" function , "continue" button, page running smoothly. trying have users input variables applied story wrote in new html page. i'm assuming code error can't seem see it.
<html> <head> <title>a4_part4</title> <script type="text/javascript"> //<![cdata[ function storytime() { //displays alert alert("welcome interactive story spot."); } function confirm() { var spaceship = document.getelementsbyname("transport")[0].value; var ducatti = document.getelementsbyname("transport")[1].value; var ferrari = document.getelementsbyname("transport")[2].value; var jet = document.getelementsbyname("transport")[3].value; var train = document.getelementsbyname("transport")[4].value; var transport = ""; var name = document.getelementsbyname("name")[0].value var title = document.getelementsbyname("title")[0].value var noun = document.getelementsbyname("noun")[0].value var num1 = document.getelementsbyname("num1")[0].value var num2 = document.getelementsbyname("num2")[0].value var miles = document.getelementsbyname("measuretravel")[0].value var kms=document.getelementsbyname("measuretravel")[1].value; var travelmeasure = document.getelementsbyname("measureravel").value //determine mode of transportation chosen if (document.getelementsbyname("transport")[0].checked) { transport = spaceship; } else if (document.getelementsbyname("transport")[1].checked) { transport = ducatti; } else if (document.getelementsbyname("transport")[2].checked) { transport = ferrari; } else if (document.getelementsbyname("transport")[3].checked) { transport = jet; } else if (document.getelementsbyname("transport")[4].checked) { transport = train; } //determine measure of travel chosen if (document.getelementsbyname("measuretravel")[0].checked) { miles = "+num1+" + "+num2+" * 1.60934 measuretravel = miles; } else if (document.getelementsbyname("measuretravel")[1].checked) { measuretravel = kms; } //display alert alert ("hello, "+name+", story values "+title+", "+transport+", "+noun+", "+num1+", "+num2+", , "+measuretravel+" "); } function story() { //collect users input data { var transport = ""; var name = document.getelementsbyname("name")[0].value var title = document.getelementsbyname("title")[0].value var noun = document.getelementsbyname("noun")[0].value var num1 = document.getelementsbyname("num1")[0].value var num2 = document.getelementsbyname("num2")[0].value var travelmeasure = document.getelementsbyname("measureravel").value //write new html page display story document.write("<h1>"+title+"</h1>"); document.write("<p>once upon time,</p>"); document.write("<p>"+name+" trying make way "+noun+" in "+transport+".</p>"); document.write("<p>unfortunately "+name+" didn't realise how far away "+houn+" was.</p>") document.write("<p> assumption "+num1+" "+measuretravel+" when turned out "+num2+" "+measuretravel+".</p>") document.write("<p> thankfully "+name+" likes travel.<p>") document.write("<p>the end</p>"); } //]]> </script> </head> <body> <form id="storyform" action=""> <h1>create own story</h1> <p style="font-weight:bold;"> name <input type="text" name="name" id="name" value="jane doe"> </p> <p style="font-weight:bold;"> story title <input type="text" name="title" id="title" value="enter story title here"> </p> <p style="font-weight:bold;">choose mode of transportation</p> <input type="radio" name="transport" id="transport" value="spaceship" checked="checked"> spaceship <br> <input type="radio" name="transport" id="transort1" value="ducati"> ducati <br> <input type="radio" name="transport" id="transport2" value="ferrari"> ferrari <br> <input type="radio" name="transport" id="transport3" value="jet"> jet <br> <input type="radio" name="transport" id="transport4" value="train"> train <br> <br> enter noun <input type="text" name="noun" id="noun" value="paris" onclick=""/> <br> enter number <input type="text" name="num1" id="num1" value="1" checked="checked" onclick=""/> <br> enter number <input type="text" name="num2" id="num2" value="2" onclick=""/> <p style="font-weight:bold;">choose means of measuring travel</p> <input type="radio" name="measuretravel" id="measuretravel1" value="miles"> miles <br> <input type="radio" name="measuretravel" id="measuretravel2" value="kms" checked="checked"> kilometers <br> <br> <br> <p>please confirm before continue<p> <input type="reset" value="clear form"> <input type="button" value="story time!" onclick="storytime();"> <input type="button" value="confirm" onclick="confirm();"> <input type="button" value="continue" onclick="story();"> </form> </body> </html>
it looks there's rogue curly brace in story function
this function looks right now
function story() { //collect users input data { ... } it's not registering function because have syntax error. can either remove second { or can add } close it. former.
Comments
Post a Comment