Prevent click from bubbling to parent
Hi, I have the following structure:
Where the button div has an event listener so that it will display a drop-down menu. The anchor tag in this case will redirect to the main page which effectively will remove the category filter that is selected. The problem is clicking on the link triggers the click event on the parent and for a split second the drop-down menu is visible.
Is there a way to prevent the click event from bubbling to the parent without using JavaScript? I'm looking for something that is pretty much the opposite of
pointer-events: none, causing clicks to never go through this element.
Thanks!10 Replies
Ummm this seems wrong
Rethink your life and don't put a href in a button please
Done, now it's a div
same question? 😅
Is there a way to prevent the click event from bubbling to the parent without using JavaScript?No, there's not.
All right thanks!
there might be nice and clean solutions, but hard to tell without knowing the rest of your app
It's all right its just a quick protoype and wnated to take a shortcut
If you explain a bit more about what you're trying to do we might be able to find a different tool for this specific job
It's a dropdown menu where user selects a category to filter some posts. When a category is selected already, it displays a little cross to remove any filters and display everything again. Currently the filtering is done using query parameters, so I thought of using a link to reset them by 'redirecting' to main page since it happens to look the same but without filters.
But like I said I was looking for a shortcut to avoid having to do all of this in JavaScript, its just for a quick demo.
Thank you though
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
Yes, it seems there's no other way