显示除选定单元格html之外的表格的另一个单元格(table.cell(this).data()

时间:2017-11-07 15:22:03

标签: javascript jquery asp.net-mvc datatables

我正试图从表格中选择所选单元格+另一个单元格。 这是我的表:

  <table id="display1">
  <thead>
          <th>Teams</th>
          <th>Odd1</th>
          <th>Odd2</th>
  </thead>
  <tbody>
      <tr>
        <td>Team1-Team2</td>
        <td>1</td>
        <td>2</td>
      </tr>
      <tr>
        <td>Team3-Team4</td>
        <td>5</td>
        <td>6</td>
      </tr>
  </tbody>
 <div id="selectedOption"></div>

这是我的剧本:

<script>
  var table = $('table.display1').DataTable()
$('#display1 tbody').on('click', 'tr', function () {
        $("#selectedOption").html(table.row(this).data()[2]);
        $('#display1 tbody').on('click', 'td', function () {
        $("#selectedOption1").html(table.cell(this).data());
        });
    });

当我点击Odd1或Odd2时,我想以div显示:

 Team1-Team2 1 
 Team1-Team2 2
 Team3-Team4 5

我的代码有什么问题

1 个答案:

答案 0 :(得分:0)

我想你可能想看看你的$(这个)而且表格也没有定义......

这是否接近你想要的......

 $(document).ready(function(){
    $('#display1 tbody').on('click', 'tr', function () {
       var table = $("#display1");console.log(this)
        $("#selectedOption").html($(this));
        $('#display1 tbody').on('click', 'td', function () {
        $("#selectedOption1").html($(this));
        });
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>



  <table id="display1">
  <thead>
          <th>Teams</th>
          <th>Odd1</th>
          <th>Odd2</th>
  </thead>
  <tbody>
      <tr>
        <td>Team1-Team2</td>
        <td>1</td>
        <td>2</td>
      </tr>
      <tr>
        <td>Team3-Team4</td>
        <td>5</td>
        <td>6</td>
      </tr>
  </tbody>
 <div id="selectedOption"></div>