javascript放在最后的重要性

<input type="checkbox" id="checkall" />全选

<c:forEach items="${productlist }" var="product" varStatus="i">
    <tr onmouseover="this.style.backgroundColor = 'white'"
        onmouseout="this.style.backgroundColor = '#F5FAFE';">
            <td style="CURSOR: hand; HEIGHT: 22px" align="center" width="18%">
                <!-- 在此处。。。。。。。。。。。。。。。。。。。。。。。。 -->
                <input type="checkbox" name="delproduct" value="${product.pid }" style="margin-top:0px"/>&nbsp;&nbsp;&nbsp;${i.count }
                <!-- 在此处。。。。。。。。。。。。。。。。。。。。。。。。 -->
            </td>
            <td style="CURSOR: hand; HEIGHT: 22px" align="center"
                width="17%"><img width="40" height="45" src="${pageContext.request.contextPath }/${product.pimage }"></td>
            <td style="CURSOR: hand; HEIGHT: 22px" align="center"
                width="17%">${product.pname }</td>
            <td style="CURSOR: hand; HEIGHT: 22px" align="center"
                width="17%">${product.shop_price }</td>
            <td style="CURSOR: hand; HEIGHT: 22px" align="center"
                width="17%">${product.is_hot==1?"是":"否" }</td>
            <td align="center" style="HEIGHT: 22px">
                <a href="${ pageContext.request.contextPath }/adminupdateproductui?pid=${product.pid}">
                    <img src="${pageContext.request.contextPath}/images/i_edit.gif"
                        border="0" style="CURSOR: hand">
                </a>
            </td>
            <td align="center" style="HEIGHT: 22px">
                <a href="javascript:void(0)" onclick="deleteproduct('${product.pid}')">
                    <img src="${pageContext.request.contextPath}/images/i_del.gif"
                    width="16" height="16" border="0" style="CURSOR: hand">
                </a>
            </td>
    </tr>
</c:forEach>

只有当下列代码放在.html或者.jsp的末尾处时才能生效，如果放在body的前面不能生效

<script type="text/javascript">
    $("#checkall").on('click',function() {  
        $("input[name='delproduct']").prop("checked", this.checked);  
    });  

    $("input[name='delproduct']").on('click',function() {  
            var $subs = $("input[name='delproduct']");  
        $("#checkall").prop("checked" , $subs.length == $subs.filter(":checked").length ? true :false);  
    }); 
</script>

/*****************

******************

最重要的如果想在页面的前面使用最后的这段jQuery代码，需要放在页面加载函数里面即$(function(){.........该段jQuery代码........});

******************

******************/