Create ghost page

You can do it this way. check for a unique class for the page in the menu or add an unique class. you can do it by checking CSS classes under screen options in the menu edit page.

lets say the class you added is ghost-page

Then in the js file

jQuery(document).ready(function(){
    jQuery('.ghost-page').on('click', function(e){
        e.preventDefault(); 
    });
});

But the page will still be accessible by home_url()/page-slug but the above will disable the click event from the menu for this page.

But if you don’t want a page to exist then, add a custom link to the menu with # in the url and add the css class and label as foo, by doing so there wont be a page to link with and the above js code will disable the click event.

Hope it helps!