Question

在我正在工作的项目中，我点击了一些具有给定id的按钮，我收集这些id以在一些表格中显示数据。它在chrome和edge中运行良好，但每次我使用firefox时，id都会返回undefined。

代码如下：

＆＃13;

function reply_clickGF(e) {
  // collect the id of the button clicked
  e = e || window.event;
  console.log(e);
  e = e.target || e.srcElement;
  var clickId = e.id;
}

＆＃13;

<div id="groundFloor" class="tab active">
  <br>
  <h2>Ground Floor</h2>
  <div id="buttonDispGF" style=" background-image: url('img/ground floor.jpg')" onclick="reply_clickGF()">
    <div id="maxTableGF">
      <p> Maximum values over the last week:</p>
      <table style="width: 100%" class="maxTable">
        <tbody>
          <tr>
            <th class="border">Sensor Type</th>
            <th class="border">Max Reading</th>
            <th class="border">Mote Id</th>
          </tr>
          <tr>
            <td class="border">Pir (Presence) </td>
            <td class="border" id="data">1</td>
            <td class="border" id="data">106</td>
          </tr>
          <tr>
            <td class="border">Magnetic (Door) </td>
            <td class="border" id="data">1</td>
            <td class="border" id="data">106</td>
          </tr>
          <tr>
            <td class="border">Acoustic (dB) </td>
            <td class="border" id="data">38.69</td>
            <td class="border" id="data">106</td>
          </tr>
        </tbody>
      </table>
      <div id="table">
        <table id="colourCode">
          <tbody>
            <tr>
              <td height="70"><svg width="50" height="40">
								<circle cx="20" cy="20" r="13.5" stroke="black" stroke-width="2" fill="green"></circle>
							</svg></td>
              <td height="70">Last Reading Within 12 Hours</td>
            </tr>
            <tr>
              <td height="70"><svg width="50" height="40">
								<circle cx="20" cy="20" r="13.5" stroke="black" stroke-width="2" fill="yellow"></circle>
							</svg></td>
              <td height="70">Last Reading Between the Last 12 to 24 Hours </td>
            </tr>
            <tr>
              <td height="70"><svg width="50" height="40">
								<circle cx="20" cy="20" r="13.5" stroke="black" stroke-width="2" fill="red"></circle>
							</svg></td>
              <td height="70">Last Reading Over 24 Hours or no Data for This Mote</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
    <a href="#GFDisplay" class="tooltip" style="left: 600px; top: 140px;"><input type="button" value="104" name="104" id="104" class="button" onmouseover="handler(this)" style="position: absolute; border: 2px solid black; background-color: red;"></a>
    <a href="#GFDisplay" class="tooltip" style="left: 530px; top: 210px;"><input type="button" value="105" name="105" id="105" class="button" onmouseover="handler(this)" style="position: absolute; border: 2px solid black; background-color: red;"></a>
    <a href="#GFDisplay" class="tooltip" style="left: 400px; top: 80px;"><input type="button" value="106" name="106" id="106" class="button" onmouseover="handler(this)" style="position: absolute; border: 2px solid black; background-color: green;"></a>
    <a href="#GFDisplay" class="tooltip" style="left: 440px; top: 120px;"><input type="button" value="205" name="205" id="205" class="button" onmouseover="handler(this)" style="position: absolute; border: 2px solid black; background-color: red;"></a>
  </div><br><br>
  <div class="buttonDisplay">
    <a href="#GFDisplay"><button type="button" class="dataButton" id="displayTables" onclick="displayAllTablesGF()"> Display All Motes Data</button></a>
    <button type="button" class="dataButton" id="clearAll" onclick="resetGF()">Clear All</button>
  </div>
  <div id="GFDisplay"></div>
</div>

＆＃13;

有人可以通过指示能够在所有3个浏览器中运行它来帮助我吗？

Answer 1

我自己解决了这个问题，只需在我的html中将event添加到reply_clickGF（），现在它可以在所有3个浏览器中使用。

＆＃13;

 <div id="buttonDispGF" style=" background-image: url('img/ground floor.jpg')" onclick="reply_clickGF(event)">

＆＃13;

点击事件在chrome和edge中工作，但不在firefox中

1 个答案: