在这种情况下如何获取选定的表tr行

时间:2016-05-05 15:47:53

标签: javascript jquery html-table

我有一张桌子如下所示

点击按钮,如何选择所选的手机号码

<table class="table table-striped table-bordered table-hover table-full-width dataTable" id="sample_2" aria-describedby="sample_2_info">
   <tbody role="alert" aria-live="polite" aria-relevant="all">
      <tr class="vendorslist odd">
         <td class=" "><label class="radio"><input type="radio" onclick="UpdateButtonTest(this);" id="5300085118-90304910251387" name="optionsRadios1" value="option1"></label></td>
         <td class=" sorting_1"> VENDOR</td>
         <td class=" ">5300085118</td>
         <td class=" ">544444444</td>
         <td class=" ">Restaurant</td>
         <td class=" ">Restaurants</td>
         <td class=" ">wer@gmail.com</td>
         <td class=" "><span id="span-5300085118-90304910251387" class="label label-success">Active</span></td>
      </tr>
      <tr class="vendorslist odd">
         <td class=" "><label class="radio"><input type="radio" onclick="UpdateButtonTest(this);" id="5300085118-90304910251387" name="optionsRadios1" value="option1"></label></td>
         <td class=" sorting_1"> VENDOR</td>
         <td class=" ">5300085118</td>
         <td class=" ">900000000</td>
         <td class=" ">Restaurant</td>
         <td class=" ">Restaurants</td>
         <td class=" ">serr@gmail.com</td>
         <td class=" "><span id="span-5300085118-90304910251387" class="label label-success">Active</span></td>
      </tr>
   </tbody>
</table>
<button id="btnSave">Save Click</button>

这是我的小提琴

https://jsfiddle.net/atg5m6ym/4123/

您能否告诉我如何选择所选表格的手机号码

首先我需要值544444444,如果是第二个我需要900000000

2 个答案:

答案 0 :(得分:1)

移动td上的课程会更容易,但你可以这样做: -

$(document).on('click', '#btnSave', function() {
  var mobile = $('table :checked').closest('tr').find('td:eq(3)').text();
  alert(mobile);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table table-striped table-bordered table-hover table-full-width dataTable" id="sample_2" aria-describedby="sample_2_info">
  <tbody role="alert" aria-live="polite" aria-relevant="all">
    <tr class="vendorslist odd">
      <td class=" ">
        <label class="radio">
          <input type="radio" onclick="UpdateButtonTest(this);" id="5300085118-90304910251387" name="optionsRadios1" value="option1">
        </label>
      </td>
      <td class=" sorting_1">VENDOR</td>
      <td class=" ">12222</td>
      <td class=" ">544444444</td>
      <td class=" ">Restaurant</td>
      <td class=" ">Restaurants</td>
      <td class=" ">wer@gmail.com</td>
      <td class=" "><span id="span-5300085118-90304910251387" class="label label-success">Active</span>
      </td>
    </tr>
    <tr class="vendorslist odd">
      <td class=" ">
        <label class="radio">
          <input type="radio" onclick="UpdateButtonTest(this);" id="5300085118-90304910251387" name="optionsRadios1" value="option1">
        </label>
      </td>
      <td class=" sorting_1">VENDOR</td>
      <td class=" ">12233</td>
      <td class=" ">900000000</td>
      <td class=" ">Restaurant</td>
      <td class=" ">Restaurants</td>
      <td class=" ">serr@gmail.com</td>
      <td class=" "><span id="span-5300085118-90304910251387" class="label label-success">Active</span>
      </td>
    </tr>
  </tbody>
</table>
<button id="btnSave">Save Click</button>

答案 1 :(得分:0)

通过jQuery parents()

$(document).on('click', '#btnSave', function() {

    alert($('.vendorslist input:checked').parents("tr").find('td').eq(3).text());

});