Disable link on first click and act as a:hover

Question

I want to disable a link which contains a dropdown menu when user access the website via tablet devices, so, when users taps the link from the tablet:

-> The dropdown appears but the link is disabled, then on the second tap the link works.

I think that this is probably solved but I haven't found nothing suitable yet, I'm working with this code from here

jQuery(document).ready(function ($) {

    $("li.taphover > a").on('touchstart', function (e) {
        'use strict'; //satisfy the code inspectors
        var link = $(this); //preselect the link
        if (link.hasClass('hover')) {
            return true;
        } else {
            link.addClass('hover');
            $('li.taphover > a').not(this).removeClass('hover');
            e.preventDefault();
            return false; //extra, and to make sure the function has consistent return points
        }
    });

});

But it disables the link, and nothing works.

Answer 1

I found a simple Jquery plugin here that works. The link also has a tutorial about how to create a responsive menu which disables the top dropdown links (li:has(ul)) on first click.