jquery - 第一列的javascript rowindex cellindex和单元格值-6ren

jquery - 第一列的javascript rowindex cellindex和单元格值

转载作者：行者123 更新时间：2023-11-28 01:04:03

31

4

我是新手，我想通过 onclick 获取行索引、colindex 和该行第一列的值。我在不同的部分找到了这些答案，但无法将它们放在一起。如果下面的代码也能为我提供第一列中的值，我将非常高兴。提前致谢。十

    <!doctype html>
    <html>
    <head>
    <title>Determine Click Position on click of a table cell</title>
    <!--CSS -->
    <style>
        td{
            cursor:pointer;
            background: -moz-linear-gradient(top, #ffffff, #D1E3E9);
            background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#D1E3E9));
            text-align:center;
        }

        td:hover{
            background: -moz-linear-gradient(top, #249ee4, #057cc0);
            background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#249ee4), to(#057cc0));
        }

        td:active
        {
            background: -moz-linear-gradient(top, #057cc0, #249ee4);
            background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#057cc0), to(#249ee4));
        }

        #result{
            font-weight:bold;
            font-size:16pt;
        }
    </style>
    <!--JAVASCRIPT -->
    <script  src="http://code.jquery.com/jquery-1.9.1.min.js" ></script>     
    <script>
        $(document).ready(function(){
            $("#myTable td").click(function() {     

                var column_num = parseInt( $(this).index() ) + 1;
                var row_num = parseInt( $(this).parent().index() )+1;    

                $("#result").html( "Row_numx =" + row_num + "  ,  Rolumn_numx ="+ column_num );   
            });
        });
    </script>
    </head>
    <body>
        <div id="result"> </div>
        <table id="myTable" border="1" style="border-collapse: collapse;" cellpadding="8">
            <!--1st ROW-->
            <tr>
                <td>row 1, col 1</td>
                <td>row 1, col 2</td>
                <td>row 1, col 3</td>
                <td>row 1, col 4</td>
                <td>row 1, col 5</td>
            </tr>

            <!--2nd ROW-->
            <tr>
                <td>row 2, col 1</td>
                <td>row 2, col 2</td>
                <td>row 2, col 3</td>
                <td>row 2, col 4</td>
                <td>row 2, col 5</td>
            </tr>

            <!--3rd ROW-->
            <tr>
                <td>row 3, col 1</td>
                <td>row 3, col 2</td>
                <td>row 3, col 3</td>
                <td>row 3, col 4</td>
                <td>row 3, col 5</td>
            </tr>

            <!--4th ROW-->
            <tr>
                <td>row 4, col 1</td>
                <td>row 4, col 2</td>
                <td>row 4, col 3</td>
                <td>row 4, col 4</td>
                <td>row 4, col 5</td>
            </tr>

            <!--5th ROW-->
            <tr>
                <td>row 5, col 1</td>
                <td>row 5, col 2</td>
                <td>row 5, col 3</td>
                <td>row 5, col 4</td>
                <td>row 5, col 5</td>
            </tr>
        </table>
    </body>
    </html>

最佳答案

您可以使用 siblings(:first-child)得到第一个 sibling ，这将是你的第一个<td> .

var col0_val = $(this).parent().children(":first-child").html();

这是片段:

$(document).ready(function() {
  $("#myTable td").click(function() {

    var column_num = parseInt($(this).index()) + 1;
    var row_num = parseInt($(this).parent().index()) + 1;
    var col0_val =  $(this).parent().children(":first-child").html();

    console.log(col0_val);

    $("#result").html("Row_numx =" + row_num + "  ,  Rolumn_numx =" + column_num + ", First_column_value = " + col0_val);


  });
});

td {
  cursor: pointer;
  background: -moz-linear-gradient(top, #ffffff, #D1E3E9);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#D1E3E9));
  text-align: center;
}
td:hover {
  background: -moz-linear-gradient(top, #249ee4, #057cc0);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#249ee4), to(#057cc0));
}
td:active {
  background: -moz-linear-gradient(top, #057cc0, #249ee4);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#057cc0), to(#249ee4));
}
#result {
  font-weight: bold;
  font-size: 16pt;
}

<!doctype html>
<html>

<head>
  <title>Determine Click Position on click of a table cell</title>
  <!--JAVASCRIPT -->
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>

<body>
  <div id="result"></div>
  <table id="myTable" border="1" style="border-collapse: collapse;" cellpadding="8">
    <!--1st ROW-->
    <tr>
      <td>row 1, col 1</td>
      <td>row 1, col 2</td>
      <td>row 1, col 3</td>
      <td>row 1, col 4</td>
      <td>row 1, col 5</td>
    </tr>

    <!--2nd ROW-->
    <tr>
      <td>row 2, col 1</td>
      <td>row 2, col 2</td>
      <td>row 2, col 3</td>
      <td>row 2, col 4</td>
      <td>row 2, col 5</td>
    </tr>

    <!--3rd ROW-->
    <tr>
      <td>row 3, col 1</td>
      <td>row 3, col 2</td>
      <td>row 3, col 3</td>
      <td>row 3, col 4</td>
      <td>row 3, col 5</td>
    </tr>

    <!--4th ROW-->
    <tr>
      <td>row 4, col 1</td>
      <td>row 4, col 2</td>
      <td>row 4, col 3</td>
      <td>row 4, col 4</td>
      <td>row 4, col 5</td>
    </tr>

    <!--5th ROW-->
    <tr>
      <td>row 5, col 1</td>
      <td>row 5, col 2</td>
      <td>row 5, col 3</td>
      <td>row 5, col 4</td>
      <td>row 5, col 5</td>
    </tr>
  </table>
</body>

</html>

关于jquery - 第一列的javascript rowindex cellindex和单元格值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40733270/

31

4

0

文章推荐： c++使用指针的自定义矩阵模板

文章推荐： c++ - Windows 编程 : WNDCLASS structure: hIcon member Problem

文章推荐： c++ - 4 个有符号字节打包成 32 位无符号

文章推荐： html - div inside li 全 Angular

Extjs - 获取选定行的 rowIndex
我已被选中一行，现在我想获取 rowIndex 也许喜欢 grid.getSelectionModel().getSelection()[0].rowIndex 但它是未定义的。我怎样才能得到它谢谢
c# - 获取gridview外的Gridview RowIndex
我的 Button1 在面板内，我想访问 rowindex 以便隐藏该 Imagebutton。但是当我进入 Debug模式时，GridView1.SelectedIndex 有一个空值。请帮忙!
c# - 获取页脚的 RowIndex
我有如下代码。我的问题是我无法获取页脚的行索引。使用代码，我得到了页脚的 rowindex = -1。我试图在网上找到解决方案，但没有找到任何东西。感谢您帮助我。先感谢您。 protected v
c# - 对于每个获取 RowIndex
有没有办法让每个人都得到行索引？示例: int rowIndex = 0; foreach (int a in numbers) { // Manipulation rowIndex
Javascript rowIndex 方法不起作用
我正在使用 TR 的 rowIndex 属性，但它不起作用。如果我在这里做错了什么，请告诉我。 function myMethod(){ alert ( this.pa
jquery - jQuery 获取表的当前 rowIndex
单击时我的表格单元格会突出显示。我需要找到突出显示的单元格的 rowIndex 。我尝试这样做 $(".ui-state-highlight").index(); // Results to 0 我也
c# - 单击复选框时如何获取 GridView RowIndex
我有一个简单的 GridView 。每行都有一些 boundFields 和一个复选框。该复选框具有 AutoPostBack=True 并使用 OnCheckedChanged 事件触发方法 (ch
javascript - rowIndex 返回 -1
我正在使用 greasemonkey 脚本并使用以下代码更新表格。我附上了 table 的图片。但是当我点击 delete 时，rowIndex 为所有行返回 -1。我不明白为什么它返回 -1。 ta
jquery - 第一列的javascript rowindex cellindex和单元格值
我是新手，我想通过 onclick 获取行索引、colindex 和该行第一列的值。我在不同的部分找到了这些答案，但无法将它们放在一起。如果下面的代码也能为我提供第一列中的值，我将非常高兴。提前致谢。
javascript - 使用 rowIndex 在单击的行正下方插入新行
下面是我写的代码来做以下事情每个表格行都包含一个“+”按钮当点击按钮时，代码应该找到被点击行的行索引然后一个新行应该添加到 cilcked 行的 (rowindex+1) 位置。即，就在点击行的
angular - Primeng 如何扩展行的 rowIndex？
... 存在一些这样的 ... 对于数据表最佳答案在您用于扩展行的 ng-template 中使用以下代码 expand 在展开时点击的按钮使用下面的代码获取行索引 expand(
wpf - 从 xaml 获取 RowIndex
我有一个带有 DataGridTemplateColumns 的 DataGrid。在 TemplateColumn 中，我使用了一个工作正常的 DataTrigger。它从 DataGrid 父级检
excel - Worksheet.Columns 属性要求我提供 RowIndex？
如果我在 VBA 编辑器中编写此内容: Dim ws As Worksheet: set ws = ActiveSheet ws.Columns( IntelliSense 向我显示了一个看似不相关的
javascript - 获取 tablerow 中的按钮 rowIndex
我尝试获取表中按钮的 rowIndex？没有什么对我有用: let tr = $(''); let td = $(''); let btn = $(''); td.html(btn); tr.html
javascript - 如何使用 Javascript 编辑表行的 rowIndex
这可能是非常规的，但我想知道如何编辑表行的索引？所以我可以像这样获取表行的当前 rowIndex var rowIndex = document.getElementsByClassName('ed
javascript - 将 rowindex 传递给 JavaScript
我试图将行索引从 gridview 内部传递到 javascript 函数，但收到错误消息，指出 databind 不包含属性名称容器。 ','','','',');"> 我只想将 gridview
Extjs:从存储中删除行-> store.removeAt(RowIndex)
我的 GridPanel 中有一堆来自一家商店的 RowIndexes。我想从我的商店中删除这些。如果我只有一个，没问题，Grid 的 View 是 refrsehd，唯一的条目是 away。但是当
c# - 尝试查找时 RowIndex 返回 null
我试图找到具有被单击的删除按钮的行的 rowIndex。但是，当单击删除按钮时，它找不到 ID，而是返回 null 并出错。我试过这个: $("#delete").on("click", funct
javascript - 如何在 extjs 小部件列中获取 rowIndex
我需要小部件列中的一个按钮来了解其在 ExtJS 6 panel.grid 中的 rowIndex，以便在单击按钮时它可以使用该功能。我知道我可以从渲染器函数中提取该信息，但这似乎是在创建按钮之前执行
java - 使用两个标识符(rowIndex、colIndex)比较数组的快速方法
您好，我正在开发一个使用 block 的 2d map 加载器。我使用此方法来计算与屏幕边界相交的 block 的位置。 // left bottom rect.x = x - x % chunkS

首页

博学

6Ren·AI

商城

jquery - 第一列的javascript rowindex cellindex和单元格值