TypeError:$(...)。on不是函数 - 将选中的复选框行值分组

时间:2016-06-13 14:34:00

标签: javascript jquery jsp

我需要帮助来解决这个错误:“TypeError:$(...)。on不是函数”

我已经使用jquery函数对选中复选框行中的值集进行分组。 checkedRows数组中的值不会在我的控制台中打印,而是出现错误。帮助我打印选中的复选框行值。

这是我的jsp页面中的jquery函数

<script>
    $('#btn').on('click', function() {
            var checkedRows = [];
            $(':checkbox:checked').closest('tr').each(function() {
                checkedRows.push(
                  $(this).find('td:gt(0)').map(function() {
                      return $(this).html();
                  }).get()
                ); 
             });        
            console.log( checkedRows );

        });
    </script>

JSP

<%@page import="java.util.List"%>
        <%@page import="web.Products"%>
        <%@page import="java.util.ArrayList"%>
        <%@page contentType="text/html" pageEncoding="UTF-8"%>
        <!DOCTYPE html>
        <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/javascript" src="JS/jquery-1.4.2.min.js"></script>

    <script>
    $('#btn').on('click', function() {
            var checkedRows = [];
            $(':checkbox:checked').closest('tr').each(function() {
                checkedRows.push(
                  $(this).find('td:gt(0)').map(function() {
                      return $(this).html();
                  }).get()
                ); 
             });        
            console.log( checkedRows );

        });
    </script>

    </head>
         <form name="sform" method="post" action="Save_Products"> 
          <table style="width:40%">
              <tr> <th> Brand Name</th>
                  <th> Product Name</th>
                  <th> Description</th>
              </tr>
              <tr>
                   <td><%
      List<Products> pdts = (List<Products>) request.getAttribute("productlist");
      if(pdts!=null){
        for(Products prod: pdts){
      out.println("<input type=\"hidden\" name=\"brand_name\" value=\""  + prod.getBrandname() + "\">");
          out.println("<br/>"+prod.getBrandname());

            } %> </td>
           <td><%
      if(pdts!=null){
        for(Products prod: pdts){
           out.println("<input type=\"checkbox\" name=\"prod\" checked=\"checked\" value=\""  + prod.getProductname() + "\">"  + prod.getProductname()+"<br>");
            } } %> </td>
           <td><%
           if(pdts!=null){
           for(Products prod: pdts){
            out.println("<input type=\"text\" name=\"desc\" style=\"width:50px; height:22px\" value=\""+prod.getDesc()+"\"/><br/>");
        } 
       }  
       } %> </td>  
       </tr>
        <br/>
        <br/>
        <tr>
            <td></td>
            <td align="center">  <input id="btn" type="submit" value="Save" name="save"/> </td></tr> 

          </table>
             </form>
        </html>

1 个答案:

答案 0 :(得分:0)

您使用的是哪个版本的jQuery?如果老了,试试这个:

$('#btn').live('click', function() {
            var checkedRows = [];
            $(':checkbox:checked').closest('tr').each(function() {
                checkedRows.push(
                  $(this).find('td:gt(0)').map(function() {
                      return $(this).html();
                  }).get()
                ); 
             });        
            console.log( checkedRows );

        });