Javascript onload事件未调用

Question

I am working on a simple application whereby users can select snowboarding programmes. They can only select a maximum of 3 programmes thus, the program checks a collection that stores the programmes and if it contains > 3 entries, then it should disable all the buttons available to the user. However the function doesn't seem like it's being invoked.I have tried with different event triggers such as onclick etc but to no avail. Any help is appreciated.

Javascript Function:

<script type="text/javascript">
   function restrictSelection(t) {

        var selectedButton = document.getElementById(t);
        var selectedLessonSize = document.getElementById("selectedLessonSize");
        if (selectedLessonSize.value > 3) { 
            alert("more than 3");
             selectedButton.disabled = true;  
         } else {
             selectedButton.disabled = false;
             alert("less than 3");
         }  
 }  

</script>

JSP ForEach Loop (iterates through a collection and displays available programmes):

<c:forEach var="entry" items="${lessonTimetable.lessons}">

    <form method="POST" action="chooseLesson">
        <tr>
            <td><c:out value="${entry.key}"/></td>
            <td><c:out value="${entry.value.description}"/></td>
            <td><c:out value="${entry.value.date}"/></td>
            <td><c:out value="${entry.value.startTime}"/></td>
            <td><c:out value="${entry.value.endTime}"/></td>
            <td><c:out value="${entry.value.level}"/></td>
            <td><input type="hidden" name="lessonid" value="${entry.key}"/>
                <input type="hidden" id="selectedLessonSize" value="${lessonSelection.numChosen}"/>
                <input id="button${entry.key}" type="submit" value="select lesson" disabled="true" onload="restrictSelection(this)"/>
            </td>
        </tr>
    </form>
</c:forEach>

Answer 1

尝试将<input id="button${entry.key}" type="submit" .....更改为<button id="button${entry.key}" onclick="restrictSelection(this.id)">.....