从html按钮调用javascript

Question

A quick summary of what I am trying to do. I am trying to make a webpage that receives a list from my python server using flask. It then adds each element of the list with a checkbox form. After that using javascript I will figure out which checkboxes have been checked and return the string to the flask server. I've tried to implement it and so far the checkbox list creation works. I just can't figure out how to call the javascript from the html button. I tried to use onClick= "function" but it doesn't seem to work.

{% extends "layout.html" %}
{% block content %}

<!-- create the checkbutton lists -->
  <tr><th>Courses</th></tr>
 <br>
{% for i in class_name %}
  <tr><td>{{i.name.tagline}}</td><td><input       type="checkbox" name="ischecked"></td></tr> 
<br><br>
  {% endfor %}

<!-- checkbox -->
<script type = "text/javascript">
document.getElementById("button").click(getChecks());

// function that finds checked boxes
function getChecks()
{  
    var boxes = document.getElementsByName('ischecked');
    var checkedBox = [];
    // loop through all checkboxes  
    for(var i =0; i < boxes.length; i++)
    {
        if(boxes[i].checked)
        {
            checkedBox.push(boxes[i]);
        }        
        document.getElementById("demo").innerHTML = " " + boxes[i] + " ";
    }
    //  return checkedBox.length > 0 ? checkedBox : null
}
</script>

<div p="demo"></p>
<br>
<input type="button" id ="button" value = "advise" />

<tr><th>endpage</th></tr>
{% endblock %}`

Answer 1

I would first recommend placing your script below the #button button, this way the element in the DOM is loaded first. Next onclick is formatted like this in native JavaScript:

obj.onclick = function(){ ... };

So you want to format it like this:

document.getElementById("button").onclick = function() {
    getChecks();
};