html - "English to Pirate" text translator. I need a button that resets the page and clears the translated text -
this have work far:
<html> <body> <h3>land lubber's pirate translator</h3> <p>simply click on buttons translate words and/or phrases english pirate talk. </p> <p> <input type="button" value="hello" onclick="document.getelementbyid('outputdiv').innerhtml= document.getelementbyid('outputdiv').innerhtml + 'ahoy ';"> <input type="button" value="stranger" onclick="document.getelementbyid('outputdiv').innerhtml = document.getelementbyid('outputdiv').innerhtml + 'scurvy dog ';"> </p> <hr> <div id="outputdiv"></div> </body> </html> as page written, multiple translations awkward. if finish translating 1 phrase , want begin new one, must reload page clear page division. make repeated translations easier, add button labeled "clear translation" below word/phrase buttons. when user clicks on button, contents of page division should cleared (by assigning innerhtml attribute empty string).
i'm not understanding bolded part means me do?
you have been changing innerhtml attribute of output div add translations. being asked set innerhtml of output "" (or ''). clears output because "" empty string. so, need add button onclick attribute sets innerhtml "". this, need add code shown below.
<input type="button" value="clear translation" onclick="document.getelementbyid('outputdiv').innerhtml = ''"> <h3>land lubber's pirate translator</h3> <p>simply click on buttons translate words and/or phrases english pirate talk. </p> <p> <input type="button" value="hello" onclick="document.getelementbyid('outputdiv').innerhtml = document.getelementbyid('outputdiv').innerhtml + 'ahoy';"> <input type="button" value="stranger" onclick="document.getelementbyid('outputdiv').innerhtml = document.getelementbyid('outputdiv').innerhtml + 'scurvy dog';"> <!-- add code here --> <input type="button" value="clear translation" onclick="document.getelementbyid('outputdiv').innerhtml = ''"> </p> <hr> <div id="outputdiv"></div>
Comments
Post a Comment