jQuery - 从表中提取单元格数据

发布于 2024-11-08 11:50:42 字数 2263 浏览 0 评论 0原文

当用户单击表行末尾的按钮时,我需要一些帮助从表中提取单元格数据。该表是通过 Ajax 技术生成的。我不确定这在访问表的元素时是否会产生影响。

<script type='text/javascript' src='jquery.js'></script> 
  <p>** click me **</p>
  <br/>
  <div id="placeHolder">some text goes here!</p>
<script>
    $("p").click(function () { 

        $.ajax({
          url: "status_2.html",       
          cache: false,
          success: fnSuccess
          }
        );
    });

   function fnSuccess(msg)
    {
        $('div#placeHolder').html(msg);
    }

function selectEditActivity(pass_id){   
    var row = $('#'+pass_id); 
    var seq = row.attr('seq');      
    // here I would like to pull the value of the date from the selected row
    // but I just can't get syntax right.  I get a null value on alert
    var from_date   = $('td', row).eq(0).html();  
    alert(from_date);
}
</script>

这是读取的 html 代码(文件:status_2.html)

  <span id="status2"> 
  <span id="response" class="response"></span>

  <table class="tableBorder">
  <tr >
   <th class="align_left">Date</th>
  </tr><tr>

  <tr seq="1" class="row_theme2" id="id3014201105191"></tr>
    <tr><td>20090519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>
   <td><a onclick="selectEditActivity('id3014201105191');" href="#">EDIT</a></td>
 </tr>

  <tr seq="2" class="row_theme2" id="id3014201105192"></tr>
    <tr><td>20100519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>   
   <td><a onclick="selectEditActivity('id3014201105192');" href="#">EDIT</a></td>
 </tr>

  <tr seq="3" class="row_theme2" id="id3014201105193"></tr>
    <tr><td>20110519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>   
   <td><a onclick="selectEditActivity('id3014201105193');" href="#">EDIT</a></td>
 </tr>
</tbody></table>

I need some help pulling cell data from table when a user clicks the an button at the end of the table row. The table is generated via Ajax technique. I'm not sure if this makes a difference when accessing elements of the table.

<script type='text/javascript' src='jquery.js'></script> 
  <p>** click me **</p>
  <br/>
  <div id="placeHolder">some text goes here!</p>
<script>
    $("p").click(function () { 

        $.ajax({
          url: "status_2.html",       
          cache: false,
          success: fnSuccess
          }
        );
    });

   function fnSuccess(msg)
    {
        $('div#placeHolder').html(msg);
    }

function selectEditActivity(pass_id){   
    var row = $('#'+pass_id); 
    var seq = row.attr('seq');      
    // here I would like to pull the value of the date from the selected row
    // but I just can't get syntax right.  I get a null value on alert
    var from_date   = $('td', row).eq(0).html();  
    alert(from_date);
}
</script>

This is the html code that gets read in (file: status_2.html)

  <span id="status2"> 
  <span id="response" class="response"></span>

  <table class="tableBorder">
  <tr >
   <th class="align_left">Date</th>
  </tr><tr>

  <tr seq="1" class="row_theme2" id="id3014201105191"></tr>
    <tr><td>20090519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>
   <td><a onclick="selectEditActivity('id3014201105191');" href="#">EDIT</a></td>
 </tr>

  <tr seq="2" class="row_theme2" id="id3014201105192"></tr>
    <tr><td>20100519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>   
   <td><a onclick="selectEditActivity('id3014201105192');" href="#">EDIT</a></td>
 </tr>

  <tr seq="3" class="row_theme2" id="id3014201105193"></tr>
    <tr><td>20110519</td>
    <td>1330</td>
  <td>1430</td>
  <td>LUNCH</td>  
   <td></td>   
   <td><a onclick="selectEditActivity('id3014201105193');" href="#">EDIT</a></td>
 </tr>
</tbody></table>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

甜心 2024-11-15 11:50:42

将此:更改

var from_date = $('td', row).eq(0).html();  

为:

var from_date = row.next().children('td').eq(0).html();

...因为您要查找的信息位于具有 ID 的信息的下一行中。具有 ID 的行没有 元素。

实例: http://jsfiddle.net/kkP56/


编辑:您可以摆脱内联 onclick 处理程序,并让 jQuery 分配处理程序(如果您愿意)。

$(function() {

    $('table tr a').click(function() {
        var from_date = $(this).parent().prevAll().last().html();
        alert( from_date );
    });

});

Change this:

var from_date = $('td', row).eq(0).html();  

to this:

var from_date = row.next().children('td').eq(0).html();

...because the information you're looking for is in the next row over from the one with the ID. The row with the ID has no <td> elements.

Live Example: http://jsfiddle.net/kkP56/


EDIT: You could get rid of the inline onclick handlers and let jQuery assign the handlers if you wanted.

$(function() {

    $('table tr a').click(function() {
        var from_date = $(this).parent().prevAll().last().html();
        alert( from_date );
    });

});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文