Remove href attribute from Anvil Links with empty "url" property

By default, Anvil adds href="javascript:void(0)" to all Links with empty url property.

However, this may be really confusing for users when they try to open the link in new tab and see a blank page.

Since Anvil Links are also the only possible way to create clickable containers (unless you go for Javascript), it will be really helpful if the href attribute is removed from links which are not really being used as links.

2 Likes

Here is the workaround I ended up using by adding this to the Native Libraries

<script>
    
function overrideEventTargetHref(event) {
  var target=event.target.closest('a')
  if (target){
  if (target.href=='javascript:void(0)') {
        target.removeAttribute('href')
    }
  }
}

document.addEventListener('mouseover',overrideEventTargetHref,true)
   
</script>

I added the event on mouseover because I also didn’t want the href to be visible on the bottom left of the browser when the link is hovered. Otherwise, if you just want to prevent the clicking, you can replace the line.

document.addEventListener('mouseover',overrideEventTargetHref,true)

with

window.addEventListener('mousedown',overrideEventTargetHref,true)