So I'm totally not into javascript, sadly I need to use it for a small project. I'm making a checklist but I can't get a variable to write to a modal box. I left out the rest of the checklist because that would be a lot of unnecessary HTML.
What I want to achieve :
The if statement with the count is going to calculate how many points you got correct on the checklist. Then he will write this calculation to the modal box/window. But I can't manage to get the variable trough. Is it a scope problem perhaps?
My code
<a class="subbtn" href="#popup1" onclick="checkboxes()">Verstuur</a>
<script>
$(document).ready(function () {
$(".checklist").contents().find(":checkbox").bind('change', function () {
val = this.checked; //<---
$(this).parent().toggleClass('checked');
});
$(".checklist").contents().find(":checkbox").bind('focus', function () {
val = this.focused; //<---
$('.focus').removeClass('focus');
$(this).parent().addClass('focus');
});
});
</script>
<script>
function checkboxes(variable) {
var inputElems = document.getElementsByTagName("input")
, count = 0;
for (var i = 0; i < inputElems.length; i++) {
if (inputElems[i].type == "checkbox" && inputElems[i].checked == true) {
count++;
}
}
if (count == '0') {
document.getElementsByClassName('content').innerHTML = variable;
}
else if (count == '5') {
alert('Not good')
}
else if (count < 5) {
alert('decent')
}
else if (count > '5') {
alert('Better')
}
}
</script>
</section>
</div>
<div id="popup1" class="overlay">
<div class="popup">
<h2>Je scoort</h2> <a class="close" href="#">×</a>
<div class="content">
<script>variable</script>
</div>
</div>
The problem seems to be the fact that you get a list. You can use that to get a single element with the classname.
function checkboxes(variable) {
var variable = "mooi";
var inputElems = document.getElementsByTagName("input")
, count = 0;
for (var i = 0; i < inputElems.length; i++) {
if (inputElems[i].type == "checkbox" && inputElems[i].checked == true) {
count++;
}
}
if (count == '0') {
document.querySelector('.content').innerHTML = variable;
}
else if (count == '5') {
alert('bagger')
}
else if (count < 5) {
alert('Waardeloos')
}
else if (count > '5') {
alert('Beter')
}
}
This worked for me.
document.getElementsByClassName('content')[0].innerHTML = variable;
Also works.
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.