Javascript 监听器点击诱饵

在测试文件中编写的代码运行得非常好，我必须将其合并到主代码中，但进展不太顺利。

基本代码由一个简单的 html 文件和一个名为“记住这一点”的按钮组成。

它有一个名为 showRememberMenu() 的函数的 onclick。该函数创建了一个显示在按钮下方的菜单。

下拉菜单有几个标签可以添加到数据中，以提醒用户为什么要尝试记住它。 （我老了，我需要所有我能得到的帮助来记住东西。）

单击按钮，查看下拉菜单，单击您想要的标签，您正在查看的数据将保存在带有该标签的数组中。单击菜单后它就会消失。

然后我的任务是将其放入一个更大的脚本中并查看它是否同样工作......哦，也许不是。单击菜单，使用标签存储数据，然后......什么？为什么菜单还在那里？原版一点击就被删除了。为什么它不消失？

如果我点击“退出不保存”标签，它仍然显示菜单。

作为用户，我正在查看一张包含数据库数据的卡片。单击此按钮是保存该数据以供以后使用的一种方法。在这里您可以看到带有新按钮的卡片。

单击该按钮查看下拉列表并选择与记住此数据相关的标签...

现在对其他卡片执行相同的操作，您就拥有了完成某些任务所需的所有数据，但为什么“&%!!! 该菜单永远不会消失？

在我没有想法后，我联系了我的同事人工智能双子座。它给了我第一个解决方案，这正是我已经拥有的代码。它建议了很多事情，但没有一个起作用。

人们相信检查节点和元素是否存在会让一切都好起来，但事实并非如此。

我们花了大约一个小时的时间才被告知不起作用的事情，并被告知时间问题，可能需要延迟，这确实不相关，但作为一个团队，我们慢慢地解决了这个问题。

如果你想尝试解决这个问题，我敢打赌你可以在更短的时间内完成。

这是有效的原始草案代码...

  <meta charset="UTF-8">
  <title>Some Javascript</title>
  <link rel="stylesheet" href="./someJavascript.css">
  <link rel="icon" href="favicons/favicon.ico" type="image/icon type">


  <div>



<p>and the javascript<br>
</p>

<pre class="brush:php;toolbar:false">let logToConsole=true;
var rowData={THId:'2', TaskName:'To climb a tree', TaskDesc:'Try using hands & feet'};
var remember=[];

function rememberProcess(remember){
    if(logToConsole) console.log('RememberProcess()');
for(i=0;i<remember.length console.log of remember.length items as remember function putdataintoremember if remember.push deletemenu menulu.parentnode.removechild showremembermenu return already exists const remember_button="document.querySelector('#remember');" menuheaders="['EXIT" no save student manager author task note menulu="document.createElement('lu');" menulu.id="rememberMenu" for i="0;i<menuHeaders.length;i++){" li="document.createElement('li');" li.innertext="menuHeaders[i];" li.id="menuHeaders[i];" li.classlist.add li.addeventlistener> { //console.log('li button clicked', menuHeaders[i], rowData)
        if(menuHeaders[i]=='EXIT no save') {deleteMenu(menuLu);return};
    putDataIntoRemember(menuHeaders[i], rowData);//[header][rowData]       
    rememberProcess(remember);//do something with the stored data structure
    deleteMenu(menuLu);
      })

    menuLu.appendChild(li);
    }

remember_button.appendChild(menuLu);      
}
</remember.length>

有一些CSS，但与问题无关

.remember_button {

        background-color: #5A5050;
        border: 0;
        border-radius: 5px;
        box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
        color: #fff;
        font-size: 12px;
        padding: 3px 4px;
        position: relative;        
        letter-spacing: 1px;
        width: 100px;

}

    /*Button goes white on hover*/
.remember_button:hover {
        background-color: #ffffff;
        color: #001F61;
        cursor:pointer;
    }    


.rememberLi{
    background-color: #aa9595;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 12px;
    padding: 3px 4px;
    position: relative;        
    letter-spacing: 1px;
    width: 100px;

}

.rememberLi:hover {
    background-color: #ffffff;
    color: #001F61;
    cursor:pointer;
}   

以上的作品，或多或少符合我的要求。

这是一个更大系统中的版本，我不会全部发布。

卡片是动态生成的，并添加了以下代码以生成与原始按钮相同类型的按钮

  <meta charset="UTF-8">
  <title>Some Javascript</title>
  <link rel="stylesheet" href="./someJavascript.css">
  <link rel="icon" href="favicons/favicon.ico" type="image/icon type">


  <div>



<p>and the javascript<br>
</p>

<pre class="brush:php;toolbar:false">let logToConsole=true;
var rowData={THId:'2', TaskName:'To climb a tree', TaskDesc:'Try using hands & feet'};
var remember=[];

function rememberProcess(remember){
    if(logToConsole) console.log('RememberProcess()');
for(i=0;i<remember.length console.log of remember.length items as remember function putdataintoremember if remember.push deletemenu menulu.parentnode.removechild showremembermenu return already exists const remember_button="document.querySelector('#remember');" menuheaders="['EXIT" no save student manager author task note menulu="document.createElement('lu');" menulu.id="rememberMenu" for i="0;i<menuHeaders.length;i++){" li="document.createElement('li');" li.innertext="menuHeaders[i];" li.id="menuHeaders[i];" li.classlist.add li.addeventlistener> { //console.log('li button clicked', menuHeaders[i], rowData)
        if(menuHeaders[i]=='EXIT no save') {deleteMenu(menuLu);return};
    putDataIntoRemember(menuHeaders[i], rowData);//[header][rowData]       
    rememberProcess(remember);//do something with the stored data structure
    deleteMenu(menuLu);
      })

    menuLu.appendChild(li);
    }

remember_button.appendChild(menuLu);      
}
</remember.length>

其余的 javascript 与原始代码几乎相同

.remember_button {

        background-color: #5A5050;
        border: 0;
        border-radius: 5px;
        box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
        color: #fff;
        font-size: 12px;
        padding: 3px 4px;
        position: relative;        
        letter-spacing: 1px;
        width: 100px;

}

    /*Button goes white on hover*/
.remember_button:hover {
        background-color: #ffffff;
        color: #001F61;
        cursor:pointer;
    }    


.rememberLi{
    background-color: #aa9595;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 12px;
    padding: 3px 4px;
    position: relative;        
    letter-spacing: 1px;
    width: 100px;

}

.rememberLi:hover {
    background-color: #ffffff;
    color: #001F61;
    cursor:pointer;
}   

点击之前的提醒

以及点击后如何卡住

我不知道问题是什么，Gemini 正在听一场完全不相关的内容的讲座，但艾和我终于缩小了范围，现在看起来太简单了。

那么为什么菜单会保留下来？