Javascript 向TH伪元素添加click事件，从TH获取数据属性，并防止TH事件在单击时触发

我正在创建一个HTML表，该表当前有一个click事件附加到列标题TH以对表进行排序

我现在要做的是，在单击某个位置时，通过显示其他隐藏列来扩展列。 现在，我最初的想法是在每个TH上创建一个：pseudo元素，它有隐藏的列，它们都有一个特定的css类，并将show事件附加到这个：pseudo元素上，但是，当我这样做时，它会触发列排序

我尝试过将$'.xxp'更改为$'.xxp:before'。单击时，函数{更改为$'.xxp:before'。单击时，函数{但是我会更改，因为TH有我需要的数据属性，当我使用$this时。parent'TH'我无法获取数据，因此扩展没有启动…你能将伪元素的父元素作为目标吗

因此，看一下代码片段，我想点击绿色来对表进行排序，我想点击红色来显示隐藏的列，但不会在当前的时间触发排序

$document.readyfunction{ var openData=null； $'.xxp'。单击，函数{ var$this=$this， colData=$this.data'col'， openItem=$'.xx'+colData+'c'， xplodeCols=$td[class^='xx']，th[class^='xx']， moreInfoCols=$'.xMI_'； //重置列 xplodeCols.hide； //检查我们是否正在关闭当前列 如果openData==colData{ //做点什么？？ openData=null moreInfoCols.show； } 否则{ openData=colData； moreInfoCols.hide； openItem.show； } }; }; //这是一个虚拟函数，用于测试- //我想运行上面的代码，但不是这个。 $'.xxp'。单击，函数{ //警告“哎呀！我不想让这件事发生！”； }; 表td，表th{边框：1px实心ccc；宽度：30px} td[class^='xx']，th[class^='xx']{ 显示：无； } .xxp{背景：00ff00！重要；} th[类^='xx']{ 背景：ccc！重要； } .xxp:以前{ 显示：内联块； 宽度：15px； 高度：15px； 内容：； 背景色：ff0000； 浮动：对； 位置：绝对位置； 利润上限：-20px； } 不 G 1. 2. 3. 4. 5. 6. 7. 8. .9 F 1. 2. 3. 4. 5. 6. 7. 8. .9 0 1. 1. 3. 2. 1. 0 0 0 0 0 0 0 1. 1. 2. 2.

---

好的，感谢@bergi的建议，我就是这样做的

$document.readyfunction{ var pseudoBtn=$.attr{'class'：'pseudoBtn'}； $'.xxp'.prependpseudoBtn； var openData=null； $'.xxp span.pseudoBtn'。单击，函数e{ e、 停止传播； var$this=$this.parent'th'， colData=$this.data'col'， openItem=$'.xx'+colData+'c'， xplodeCols=$td[class^='xx']，th[class^='xx']， moreInfoCols=$'.xMI_'； //重置列 xplodeCols.hide； //检查我们是否正在关闭当前列 如果openData==colData{ //做点什么？？ openData=null moreInfoCols.show； } 否则{ openData=colData； moreInfoCols.hide； openItem.show； } }; }; //这是一个虚拟函数，用于测试- //我想运行上面的代码，但不是这个。 $'.xxp'。单击，函数{ //警告“哎呀！我不想让这件事发生！”； }; 表td，表th{边框：1px实心ccc；宽度：30px} td[class^='xx']，th[class^='xx']{ 显示：无； } .xxp{背景：00ff00！重要；} th[类^='xx']{ 背景：ccc！重要； } .xxp>span.pseudoBtn{ disp 铺设：直列块； 宽度：15px； 高度：15px； 背景色：ff0000； 位置：绝对位置； 利润上限：-20px； } 不 G 1. 2. 3. 4. 5. 6. 7. 8. .9 F 1. 2. 3. 4. 5. 6. 7. 8. .9 0 1. 1. 3. 2. 1. 0 0 0 0 0 0 0 1. 1. 2. 2.

---

不能将侦听器附加到伪元素。它们被称为pseudo是有原因的……是的@Bergi，我知道它们实际上并不存在于DOM中。我希望：before:hover上使用的指针事件的组合可能是一个选项，但我需要弄清楚这一点，而是创建一个实际的元素并将其附加到。我看不出有什么理由使用CSS pseude元素来实现这一点。啊，是的。谢谢@Bergi我真不敢相信我没有想到这一点。这是其中的一天。