javascript - i want this java script to show the answer below the button not on the button , please have a look -
so code make text go on button want show below button every time click button text update following: https://jsfiddle.net/santon/mc15vy4f/ <----- example
var mybtn = document.getelementbyid("mybutton"); var clicktracker = { count:0, getmessage: function() { var message; switch(this.count) { case 1: message = "you pushed button"; break; case 2: message = "you pushed button (again)."; break; case 3: //fall through case 4: //fall through case 5: //fall through message = "you pushed button "+ this.count + " times."; break; default: message = "stop pushing button" } return message; } }; function processclick() { clicktracker.count++; this.innerhtml = clicktracker.getmessage(); } mybtn.addeventlistener("click", processclick);
in line:
this.innerhtml = clicktracker.getmessage();
you telling button change it's inner html. if want text/html appear after button can following:
var mybtn = document.getelementbyid("mybutton"); var textcontainer; var clicktracker = { count:0, getmessage: function() { var message; switch(this.count) { case 1: message = "you pushed button"; break; case 2: message = "you pushed button (again)."; break; case 3: //fall through case 4: //fall through case 5: //fall through message = "you pushed button "+ this.count + " times."; break; default: message = "stop pushing button" } return message; } }; function processclick() { clicktracker.count++; var text = clicktracker.getmessage(); if(!textcontainer){ //checking if container not yet set textcontainer = document.createelement("div"); //creating element this.parentelement.appendchild(textcontainer);//appending parent of button } textcontainer.textcontent = text; } mybtn.addeventlistener("click", processclick);
Comments
Post a Comment