在jQuery中单击时显示一行

Question

我想在一个单独的函数中获取Addmission id字段。 用户单击按钮时。

   $(document).ready(function () {
       $.each(data.student, function (i, item){
           trHTML += '<tr>'+
           '<td>'+data.student[i]['admission_no']+'</td>' +
           '<td>'+ data.student[i]['fullname']+'</td>' +
           '<td>'+data.student[i]['gender']+ '</td>' +
           '<td>'+data.student[i]['dob']+'</td>' +
           '<td>'+data.student[i]['class_no']+data.student[i]     ['class_id']+'</td>'+
           '<td><button id="selectStu" name="selectStu" ' +
           'value="'+data.student[i]['admission_no']+'">View</button>   </td>'+
           '<td></td>
           </tr>';
       });

//i get the table.
//1000  Name1 Male  2A  View
//1001  Name2 Male  2A  View
//1002  Name3 Male  2A  View



      $('#location').html(trHTML);
      $('#showByClass').show();

      $('#selectStu').click(function (e){
          e.preventDefault();
          //I need to get clicked "data.student[i]['admission_no']" Here
      });
  });

//这是我的数据数组，

{“学生”：[{“全名”：“ dfsdf fdsfsdfsf”，“性别”：“男”，“吊带”：“ 2017-01-18”，“ admission_no”：“ 1000”，“ class_id”：“ A “，” class_no“：” 2“}，{”全名“：” dfsdf fdsfsdfsf“，”性别“：”男“，”吊带“：” 2017-01-18“，” admission_no“：” 1001“，” class_id“：” A“，” class_no“：” 2“}，{” fullname“：” dfsdf fdsfsdfsf“，” gender“：”男性“，” dob“：” 2017-01-18“，” admission_no“： “ 1003”，“ class_id”：“ A”，“ class_no”：“ 2”}，{“ fullname”：“ dfsdf fdsfsdfsf”，“ gender”：“ Male”，“ dob”：“ 2017-01-18” “admission_no”： “1005”， “类标识码”： “A”， “class_no”： “2”}]}

Answer 1

您可以使用$(this).val()来获取单击按钮的值，如下所示

注意 ：

1）您可以使用class .selectStu代替id #selectStu

2）每个循环中都有错误。 您应该像这样传递第一个索引data[0]["student"]

 $(document).ready(function () { var data = [{"student":[{"fullname":"dfsdf fdsfsdfsf","gender":"Male","dob":"2017-01-18","admission_no":"1000","class_id":"A","class_no":"2"}, {"fullname":"dfsdf fdsfsdfsf","gender":"Male","dob":"2017-01-18","admission_no":"1001","class_id":"A","class_no":"2"}, {"fullname":"dfsdf fdsfsdfsf","gender":"Male","dob":"2017-01-18","admission_no":"1003","class_id":"A","class_no":"2"}, {"fullname":"dfsdf fdsfsdfsf","gender":"Male","dob":"2017-01-18","admission_no":"1005","class_id":"A","class_no":"2"}]}]; var trHTML =""; $.each(data[0]["student"], function (i, item){ trHTML += '<tr>'+ '<td>'+item['admission_no']+'</td>' + '<td>'+ item['fullname']+'</td>' + '<td>'+ item['gender']+ '</td>' + '<td>'+ item['dob']+'</td>' + '<td>'+ item['class_no']+item['class_id']+'</td>'+ '<td><button name="selectStu" class="selectStu" ' + 'value="'+item['admission_no']+'">View</button> </td>'+ '</tr>'; }); $('tbody').html(trHTML); // $('#showByClass').show(); $('.selectStu').click(function (e) { e.preventDefault(); alert($(this).val()); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table border="1px" > <thead> <tr> <th>Adm.No</th><th>F.name</th><th>gender</th><th>dob</th><th>class</th><th>action</th> </tr> <thead> <tbody > </tbody> </table>