jQuery实现获取table表格第一列值的方法

2024-12-23 22:57:10

本文实例讲述了jQuery实现获取table表格第一列值的方法。分享给大家供大家参考，具体如下：

先来看看运行效果截图：

完整代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
  $("#Button1").click(function(){
    var cols="";
    $("#tb tr").each(function(){
      var text = $(this).children("td:first").text();
      cols+=text+"|";
    })
    cols=cols.length>0?cols.substring(0,cols.length-1):"";
    alert(cols);
  })
})
</script>
</head>
<body>
  <input id="Button1" type="button" value="button" />
  <table id="tab1" border="1" style="width:100%;">
    <tr>
      <th>Id</th>
      <th>Name</th>
      <th>Address</th>
    </tr>
    <tbody id="tb">
    <tr>
      <td>11</td>
      <td>leaf</td>
      <td>gz</td>
    </tr>
    <tr>
      <td>22</td>
      <td>flower</td>
      <td>gz</td>
    </tr>
    </tbody>
  </table>
</body>
</html>

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

JQuery Ajax动态生成Table表格

前言: 本示例大概功能是前台通过JQuery的Ajax调用一般处理程序(Handler),获取表格需要显示的信息,然后转换成json格式返回给前台,前台获取到数据后循环构建表格的行,最好把行附加到表里. 目标: a 熟悉简单JQuery Ajax的使用 b 了解如何构造基本的Json格式的数据(构建Json也可以通过第三方的dll) c 熟悉下handler的基本用法 1 简单效果图 2 前台代码 <%@ Page Language="C#" AutoEventWireup=&q
基于JQuery的动态删除Table表格的行和列的代码

首先要获取Table表格的行数,我是通过后台添加表格的所以我在前台获取的时候length一下就获取到了总数赋值例如上图: 如果我要打印这个表格但不想要操作那列的内容咋办? 复制代码代码如下: for(var i=0;i<num+1;i++) { $("table tr").eq(i).find("td").eq(0).remove(); } 解释: num是从后台获取到的列表总和+1是为了表头那个也去掉. 第一个eq(i)是获取Table里的TR索引第二个
jQuery获取table下某一行某一列的值实现代码

jQuery获取table下某一行某一列的值实现代码最近需要获取到某个table下每一行某一列的值,用jQuery做了一会儿,过程如下,仅供参考: <div class="div"> <table name="info"><tr><td>lily<span>okok</span></td></tr><tr><td>18</td><
JQuery动态给table添加、删除行改进版

复制代码代码如下: <html> <head> <title> </title> <script src="js/jquery-1.4.2_min.js" type="text/javascript"></script> <script type="text/javascript" language="javascript"> var row
用jQuery获取table中行id和td值的实现代码

用jQuery获取table中行id和td值的实现代码 <%@ page language="java" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); %> <!DOCTYPE html> <html lang="zh-cn"> <head> <title>点击</title>
模仿JQuery sortable效果代码有错但值得看看

复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu
使用jquery给指定的table动态添加一行、删除一行

需求场景 1).添加一行支持在任意行添加一行且可配置的,如可在第一行添加一行.第二行添加一行.倒数第一行添加一行.倒数第二行添加一行,随需求的变化都不会影响. 前提条件:行数需在表中存在否则添加不成功. 2).删除一行支持动态删除一行. 先演示结果,如中意了在好好研究代码. 1.原始界面如下: 2.添加一行,如要添加一行需点击"添加"按钮,现点击两下会自动添加两行,效果如下截图: 3.删除一行,如要删除指定行,先要选中行然后在点击"删除"按钮进行删除(这不是废话
jquery遍历table的tr获取td的值实现方法

html代码: <tbody id="history_income_list"> <tr> <td align="center"><input type="text" class="input-s input-w input-hs"></td> <td align="center"><input type="text&q
jQuery中table数据的值拷贝和拆分

在开发的过程中,经常会遇到弹出框显示前一页table列表的情况,这时候会有好多方法来来解决,有的人可能会说重新查一遍数据显示,有的人会说直接用js将值拷贝过去,然后再修改,不过现在就介绍怎么用jquery将值拷贝到第二页并拆分拷贝的值. 母页显示数据格式如下: <div class="materialCode stdtable"> <h2>发货情况</h2> <ul class="theadUl clearfix">
jQuery实现动态给table赋值的方法示例

本文实例讲述了jQuery实现动态给table赋值的方法.分享给大家供大家参考,具体如下: html 请忽视各种class,因为前端用的是layui <table class="layui-table" lay-skin="line" id="datas"> <colgroup> <col width="150"> <col width="200"> <
jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路

花了一晚上的时间解决了一个看似很容易的问题.今晚做的这个东西中由于要获取某列中的一个ID值.如果是用平常的那种JS传值的方式此问题就不存在,但是由于此次用到的都是jquery插件,包括各种弹出框,用JS传值就得用JS那丑陋的弹出框,所以,你懂得. 网上找了很多方法,用起来都不行,后来想到了jquery中的鼠标事件,可以在鼠标经过table时,获得当前行与列的值.页面如下所示: 具体操作就是点击"删除"按钮,然后调用jquery插件页面,这时候需要获得相应行的"ID"
jQuery获取Table某列的值（推荐）

在写此篇博文时,发现在以前曾写过<获取DataTable选择第一行某一列值>http://www.cnblogs.com/insus/p/5434062.html . 但是与此篇所说的完全不一样.这篇Insus.NET需要的是jQuery去获取html table的某一行某一列的数据. 如下表: Html code: <table> <tr> <th style="width:10px;"><input id="Selec

jQuery实现获取table表格第一列值的方法

相关推荐

随机推荐