HTML 按鈕不顯示彈出窗口

Question

我有一個 HTML 頁面，它從從 python 代碼獲取的列表中創建按鈕。

list = ['a','b','c','d']它將構建按鈕名稱 abcd，4 個按鈕。

我添加了一個腳本myFunction ，單擊該腳本會彈出一個彈出窗口，以放置一些我發送到我的 python 代碼的明文。 這一切都適用於列表中的所有按鈕，除了最后一個按鈕，我不知道為什么。

僅對於頁面中創建的最后一個按鈕不會顯示彈出窗口並決定用戶在明文上輸入空響應。

代碼：

<form target="_blank" method="get" action="connect" style="display: inline;">
        {% if thing['x'] %}
                <button class="button button" onclick="myFunction(form);openNav()"> {{ thing['letters'] }} </button>
                <input type="hidden" name="reason" id="myField" value=""/>
        {% endif %}
</form>    

function myFunction(frm) {
  var txt;
  console.log(frm.reason.value); // 1st option
  console.log(event.srcElement.parentElement.nextElementSibling.outerHTML) // 2nd option
  var reason = prompt("Please enter reason:");
  if (reason == null || reason == "") {
    txt = "CANCEL";
  } else {
    txt = reason;
  }
  frm.reason.value = txt; // 1st option
  console.log(event.srcElement.parentElement.nextElementSibling.value == txt); // 2nd option
  return txt
}

我在 F12 中看到的錯誤：

Authentication:271 Uncaught TypeError: Cannot read property 'outerHTML' of null
    at myFunction (Authentication:271)
    at HTMLButtonElement.onclick (Authentication:230)

我看到它在這一行給出了紅色 X： console.log(event.srcElement.parentElement.nextElementSibling.outerHTML) // 2nd option

Answer 1

解決方案是刪除控制台日志。 這就是為最后一個按鈕放棄一切的原因。

  console.log(event.srcElement.parentElement.nextElementSibling.outerHTML) // 2nd option

因為它得到了 NULL 響應。