Prevent Default does not work

@billybidley – Sorry to hear you had trouble.

Did you open a support ticket or email? Our team is on every day replying.

Not sure how your setting things up but it sounds as if your selector is for an element with a link inside it, you might need to specify the a tag within the element specifically. Lets say you have .wp-button-component as your selector, then we are gonna prevent the default on that element, but the click event really comes from the a within, thus your selector would need to be .wp-button-component a.

Otherwise this has been solid feature for nearly 5 years without change or reported issue, so its unlikely the functionality itself rather than configuration.

Oh, I should mention its also possible that another plugin/theme also hooked in click trigger listener, we can’t prevent those, any more than they could prevent ours. Preventing the default would only apply to something like a link navigating the browser away from the current page when clicked. There are ways to make that action occur that are not preventable with “preventDefault“.

Hope that helps.

Hi Daniel,

Thanks for the reply.

The plugin does work, but needs extra steps. I had targeted an anchor link, but had a URL in the link. The wording of the plugin, “prevent default” suggested to me that it would prevent going to that link and instead open the popup, however, that is not the case. As I mentioned, you need to add javascript:void(0) as the URL for the link. This should be specified in either the plugin itself or the documentation. Many people are likely to use a link to open their popup, and not realise they need to specify this as the URL in order to get your plugin to work correctly.

@billybidley – As I mentioned before there are caveats, but both our docs/tools & our support team would have been happy to help.

We even have a tool to help you get the correct selector built into the admin toolbar on the frontend: https://docs.wppopupmaker.com/article/147-getting-css-selectors

The problem you faced isn’t something we can account for easily, its often unique per site, per theme, and every site is different, every “button” or “link” users want to target is created a different way thus the selectors need to be specialized to each scenario, no way around it.

What you missed was that your theme, page builder or gutenberg button/link wasn’t just a link.

You likely added a class to that button like my-custom-button then set your popup trigger to prevent default on the selector .my-custom-button, but your page html was most likely:

<div class="my-custom-button">
     <a href="someurl.com">Link Text</a>
</div>

In the above case you would in fact not be preventing the default of the link, but rather the <div>, but the<div> has no click event to prevent. So even if we do what you set it to do, nothing would change. Only the <a href> has a preventable event.

In these cases, and if you followed the guide above, you would hopefully end up with a selector of .my-custom-button a, resulting in it preventing the link itself from doing default action.

Simple fix, but could definitely be frustrating if you didn’t ask for help or read the docs & use the tools.