单击链接按钮时获取相应值的Javascript代码 [英] Javascript code for get the corresponding value when i clicked a link button

问题描述

尊敬的专家，

我已经在表中填充了一些数据，并且该表包含5列和许多行...

这是表中填充的以下数据代码.

Dear Experts,

i have populated some datas in tables and in that table contains 5 columns and many rows...

Here is the below code of data populated in table.

<table>
<tr>
<td><label> Name 1</label></td>
<td><label> Age 1</label></td>
<td><label> Sex 1</label></td>
<td><label> Adress 1</label></td>
<td><a href ='#' class = 'getval'>Details</a></td>
</tr>

<tr>
<td><label> Name 2</label></td>
<td><label> Age 2</label></td>
<td><label> Sex 2</label></td>
<td><label> Adress 2</label></td>
<td><a href ='#' class = 'getval'>Details</a></td>
</tr>

<tr>
<td><label> Name 3</label></td>
<td><label> Age 3</label></td>
<td><label> Sex 3</label></td>
<td><label> Adress 3</label></td>
<td><a href ='#' class = 'getval'>Details</a></td>
</tr>

<tr>
<td><label> Name 4</label></td>
<td><label> Age 4</label></td>
<td><label> Sex 4</label></td>
<td><label> Adress 4</label></td>
<td><a href ='#' class = 'getval'>Details</a></td>
</tr>

<tr>
<td><label> Name 5</label></td>
<td><label> Age 5</label></td>
<td><label> Sex 5</label></td>
<td><label> Adress 5</label></td>
<td><a href ='#' class = 'getval'>Details</a></td>
</tr>
</table>

当我单击详细信息"链接时，我需要JavaScript来获取所有值.
我的意思是，当我单击详细信息"链接时，我得到了相应的值(名称，年龄，性别和地址).

是否有任何JavaScript可以获取此..请帮助我.


谢谢

Dileep

I need javascript to get all the values when i click the "Details" link.
I mean when i click the "Details" link then i get the corresponding values (Name, Age,Sex and Adress).

Is there any javascript to get this .. please help me.


Thanks

Dileep

推荐答案

步骤1.CSS

Step 1. The CSS

.getval
{
    text-decoration: underline;
    cursor: pointer;
    color: blue;
}

步骤2.脚本

Step 2. the Script

function detailClick(element)
{
    var detailsTd = element;    //.parentNode;
    var detailsTr = detailsTd.parentNode;
    var labelList = detailsTr.getElementsByTagName('label');

    var str = "Name: " + labelList[0].textContent + "\n";
    str += "Age: " + labelList[1].textContent + "\n";
    str += "Sex: " + labelList[2].textContent + "\n";
    str += "Adr: " + labelList[3].textContent + "\n";
    alert(str);
}

步骤3. HTML

Step 3. The HTML

<table>
    <tbody>
        <tr>
            <td><label> Name 1</label></td>
            <td><label> Age 1</label></td>
            <td><label> Sex 1</label></td>
            <td><label> Adress 1</label></td>
            <td class = 'getval' onclick='detailClick(this);'>Details</td>
        </tr>

        <tr>
            <td><label> Name 2</label></td>
            <td><label> Age 2</label></td>
            <td><label> Sex 2</label></td>
            <td><label> Adress 2</label></td>
            <td class = 'getval' onclick='detailClick(this);'>Details</td>
        </tr>
    </tbody>
</table>

这篇关于单击链接按钮时获取相应值的Javascript代码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！