0

Is there a way to use the trigger element (in that case the div with the "container" class) in the event callback function without another dom access? When clicking on the round dot e.target = "round-btn" so e.target isn't an option here.

document.getElementsByClassName("container")[0].onclick = (e) => toggleSearchFilter(e);

function toggleSearchFilter(e) {
    e.target.classList.toggle("crossed-out");
}
.container {
    cursor: pointer;
    display: flex;
    align-items: center;
    user-select: none;
}

.round-btn {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
    background-color: black;
}

.crossed-out{
    text-decoration: line-through;
}
<div class="container"><div class="round-btn"></div>Hello</div>
Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
lucaplaysthenoob
  • 129
  • 3
  • 8
  • 2
    `e.target` is always the element which triggered the event. You need `e.currentTarget`, which is the element to which the event was attached to. – Teemu Feb 07 '20 at 18:46
  • @Teemu alright thanks for the help, `e.currentTarget` worked fine but strange it didn't show when I logged `e`. If you post it as an answer I can close the question and you'll get rep. :) – lucaplaysthenoob Feb 07 '20 at 18:51
  • Well, I suppose this has been already answered at SO, I just could'nt find a good post yet. – Teemu Feb 07 '20 at 18:53

0 Answers0