将表格行元素传递给js答案

【问题标题】：Passing table row element to a js将表格行元素传递给js
【发布时间】：2017-07-29 05:05:51
【问题描述】：

我有一个引导表，其中元素是从数据库加载的。我有一个 js 函数可以从数据库中删除一个表行，所以我在表的每一行中添加了一个按钮。

  <table id="datatable-responsive" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                      <thead>
                        <tr>
                          <th>id</th>
                          <th>client</th>
                        </tr>
                      </thead>

                      <tbody>
                         <?php
                         require("config.php");
                         // Create connection
                         $conn = new mysqli($host, $username, $password, $dbname);
                         // Check connection
                         if ($conn->connect_error) {
                             die("Connection failed: " . $conn->connect_error);
                         }

                         $sql = "SELECT * FROM users";
                         $result = $conn->query($sql);

                         if ($result->num_rows > 0) {
                             // output data of each row
                             while ($row = $result->fetch_row()) {
                                          $user_id=$row[0];
                                          $user_name=$row[1];
                                ?>

                               <tr>
                                 <!--here showing results in the table -->
                                   <td><?php echo $user_id;  ?></td>
                                   <td ><?php echo $user_name;  ?></td>

                                   <td>

                                       <input type="button" class="btn btn-danger btn-xs delete" value="Cancella sin id" onclick="deleteFunction()"/>


                                   </td>
                               </tr>

                      </tbody>
                    </table>

如何将 id 或 user_name 传递给 deleteFucntion 以便像这样在 Javascipt 中使用它们：

function deleteFunction() {

    var username = #MY_ROW_USERNAME;
    ....
}

【问题讨论】：

如果在循环时将按钮添加到每一行，则可以将 id 添加到按钮 onclick="functionDelete(id)" 的 onclick 中

标签： javascript twitter-bootstrap html-table

【解决方案1】：

TD 应该是这样的

<td id="user_name_<?=$user_id?>" onClick="deleteFunction(<?=$user_id?>)"><?=$user_name?></td>

像这样删除函数

function deleteFunction(user_id) {
   var username = document.getElementById('user_name_'+user_id).innerHTML;
}

【讨论】：

这将始终获得列表中的第一个..无论您单击哪个！
你不应该有相同 id 的元素吗？你不应该每次都有不同的ID，即。 user_name_1、user_name_2 等。如果是这样，将您的评论和我的评论结合起来就是您所需要的
但是如果你有 id 为什么你需要这个名字... ID 应该始终是唯一的，不像一个名字可以是相同的.... 如果你想引用它数据库 ID 是最好的方法。
对于 OP，将您的更改为这将使您将原始 id 传递给点击函数，进而访问正确的节点
编辑原始答案以反映当前状态