Trying to call a function using onclick
Question
I have created a function to create a table and have populated it with questions. I have tried to create a button to bring the table but it seems to not be working. Anyone know what I have missed?
<body>
<button onclick="createSheet()">Display</button>
</body>
<script>
var totalQuestions;
function createSheet() {
var sheet = "";
totalQuestions = 8;
sheet += "<div><table>";
for (var i = 0; i < totalQuestions; i++) {
sheet += "<tr>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "A" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "B" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "C" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "</tr>";
}
return sheet;
sheet += "</table></div>";
}
function addition2() {
var difficulty = 1000;
var ans;
for (var i = 0; i < totalQuestions; i++) {
var numGen = Math.round(Math.random() * difficulty + 100);
var numGen1 = Math.round(Math.random() * difficulty + 100);
var question = numGen + " + " + numGen1
var ans = numGen + numGen1
}
return question;
}
</script>
1 answers
solution1
0 ACCPTED 2021-05-15 18:08:30
I suppose what you are trying to do is display a table when the button is clicked:
<body>
<button onclick="createSheet()">Display</button>
<div id="tableContainer">
</div>
</body>
<script>
var totalQuestions;
function createSheet() {
var sheet = "";
totalQuestions = 8;
sheet += "<div><table>";
for (var i = 0; i < totalQuestions; i++) {
sheet += "<tr>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "A" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "B" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "<td class='question'>";
sheet += "<div class='questionNumber'>" + "C" + (i + 1) + "</div>";
sheet += "<div class='qContent'>" + addition2() + " </div>";
sheet += "</td>";
sheet += "</tr>";
}
// return sheet; !! return over here will stop the function from continuing
sheet += "</table></div>";
document.getElementById("tableContainer).innerHtml = sheet;
}
function addition2() {
var difficulty = 1000;
var ans;
for (var i = 0; i < totalQuestions; i++) {
var numGen = Math.round(Math.random() * difficulty + 100);
var numGen1 = Math.round(Math.random() * difficulty + 100);
var question = numGen + " + " + numGen1
var ans = numGen + numGen1
}
return question;
}
</script>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
Value is not defined when trying to call with function with onclick
Uncaught ReferenceError when trying to call a onclick Function
Using Onclick to call a nested function
Not able to call a javascript function using onclick event
call function using onclick inside string for loop
Call function in variable object using onclick?
How to Call a JS function using OnClick event
Using an "onclick" function call to modify a variable in Javascript
How to call function onClick event using ajax?
call jquery function from button (not using onclick)
Related Tags