工作时的 onclick 事件，有时两个表之间发生冲突

Question

我目前正在使用 html 表，但我的表 onclick 事件是两个表之间的冲突。两个表位于不同的页面中。但我不知道它们为什么会发生冲突，有时甚至无法正常工作。

我的 html 和 js 代码（第 1 页）----------

<table class="w3-table-all w3-margin-top" id="myTable">
<tr>
  <th style="width:22.5%;">Vendor Picture Path</th>
  <th style="width:22.5%;">Vendor Heading</th>
  <th style="width:22.5%;">Vendor Adding Date</th>
  <th style="width:22.5%;">Vendor Body</th>
  <th style="width:10%;">Add A Course</th>
</tr>
<?php

mysql_connect("host", "user", "")or die("cannot connect to server"); 
    mysql_select_db("databse name")or die("cannot select DB");
    $sql = "select * from somewhere";
    $result = mysql_query($sql);

    while($row=mysql_fetch_assoc($result))
    {
         echo '<tr>
         <td><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["pic_path"].'</div></td>             
         <td><div onclick="getval(this)" class="cventablehead" id="ventablehead" style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll; cursor: pointer; color:red;">'.$row["heading"].'</div></td>
         <td>'.$row["adding_date"].'</td>
         <td><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["body"].'</div></td>
         <td><button onclick="idna(this)">Add</button></td>
         </tr>';
    }
?>
  </table>
  <script type="text/javascript">
    function idna(el){
      var rownumber = $(el).closest('tr').index();
         alert(document.getElementById("myTable").rows[rownumber].cells[1].textContent);
    }
  </script>

我的第二个表格html和js代码（第二页）------------

 <table class="w3-table-all w3-margin-top" id="myTable">
<tr>
  <th style="width:14.28%;">Vendor Name</th>
  <th style="width:14.28%;">Course Picture Path</th>
  <th style="width:14.28%;">Course Name</th>
  <th style="width:14.28%;">Course Code</th>
  <th style="width:14.28%;">Course Adding Date</th>
  <th style="width:14.28%;">course Details</th>
  <th style="width:14.28%;">Add A Batch</th>
</tr>
<?php

    mysql_connect("host", "user", "")or die("cannot connect to server"); 
    mysql_select_db("database name")or die("cannot select DB");
    $sql = "select * from somewhere";
    $result = mysql_query($sql);

    while($row=mysql_fetch_assoc($result))
    {
         echo '<tr>
         <td id="co1"><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["vendor_heading"].'</div></td>
        <td id="co2"><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["pic_path"].'</div></td>          
         <td><div onclick="coursename(this)" id="co3" style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll; cursor: pointer; color:red;">'.$row["name"].'</div></td>
        <td id="co4"><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["code"].'</div></td> 
        <td id="co5"><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["adding_date"].'</div></td>
         <td id="co6"><div style="width:100%;height: 60px;margin: 0;padding: 0;overflow-y: scroll">'.$row["details"].'</div></td>
         <td><button onclick="idna1(this)">Add</button></td>
         </tr>';
    }
?>
  </table>
  <script type="text/javascript">
    function idna1(el){
      var rownumber = $(el).closest('td').index();
      alert(document.getElementById("myTable").rows[rownumber].cells[3].textContent);
    }
  </script>

如果我刷新页面（每个页面），那么两个表都可以正常工作。但我每次都更改我的 url，只刷新我的正文标签（使用此代码的地方）。

Answer 1

根据您的问题，我猜这两个 html 代码可以出现在同一个 HTML 文档中？

如果是这样，您将定义名为idna1() 的js 函数两次。您可能想在您的一张表中将其名称更改为 idna2()。