Downsides of onMousedown vs. onClick? - javascript

I've been dealing with a bane-of-my-existence Javascript problem involving tracking when a user clicks on a link (in case you're curious, here it is: Why does using target="_blank" cause Javascript to fail?).
I've figured out that I can solve the problem by tracking an onMousedown event rather than an onClick event.
I'm curious about the downsides of this approach. The ones I can think of:
If a user clicked down on a link and then moved the mouse off the link before releasing it, then the event would be recorded even though the user hadn't visited the link
If a user used the tab key to move the browser focus to the link and then hit enter, the click would not be recorded
Neither of these are common, so I'm not terribly worried about them.
Are there any other downsides I'm missing?

One more: mousedown captures right / middle clicks too.
But for your two reasons, I would stick to onclick. I know quite a few people who use keyboard nav. Especially search-and-gotolink in FF.(/ to search followed by enter to go to the link).
But if these two are not a problem for you, I think right / middle clicks wouldn't be too.
I think the way to track all the users who follow the link is quite tricky -- the user could right click and click on new tab / new window...

Related

Link remains :hover'ed when opened from JS

This might be a little interesting for people who know front-end in depth.
This doesn't make sense, try it yourself:
Open a link with href + target="_blank"
Close the opened tab and go back to the original
The link state is now :focus
That is fine. But what is wrong with this?
Open a link with window.open() on click event
Close the opened tab and go back to the original
The link state is now :hover, even though it's not really hovered. And you can't do anything about it unless you start moving cursor. trigger('mouseout') doesn't help and nothing really does.
Here's a JSFiddle – I've added a console.log() output for each event and made states different colors, so you can see better.
Browser keeps :hoverstatus until the mouse passes over other thing, if the mouse remained in the same position when you open the new window/tab, it will keep the :hover. When you return the focus to the page the :hover will remove as soon you pass the mouse over something else. That behavior could be buggy in some computers(not necessarily browser fault) and will stay until you click in another place.

Find out whether users uses the contextmenu to open a link

For my site I need to find out if a user navigates to a link on my page. 'Normal' clicks can be easily captured, however I also want to find out if the user uses the contextmenu on a link to navigate to an URL.
I know I can find out when the user does a right mouse button click (contextmenu), but I have no idea how to find out whether the user navigates to the link after that (e.g. clicks on 'open in new tab').
Is it even possible to do? Or perhaps there is some other method of finding out when the user navigates to an URL on the page?
You can do what facebook/google and others do, ensure all outbound links go through your own internal refer/log, ie:
http://example.com/r=http://someSite.example.com/foobar...
There's no assurances you can do anything better than this with javascript, but you can bind a function to listen in on link clicks with the second-mouse-button, and set up some hackish ensure-other-page-loads-eventually mechanism with server-side code, but that's just way out there and I'd highly advise against that.
Just stick with the thing google/facebook does, everything else is a cheap unstable hack that isn't worth the effort.

disable onclick ads with a content-script in Google Chrome

There are some video streaming sites that pop up an ad anytime you click anywhere on the page. The problem is, you have to click on the page to press play! So I was thinking of making a UserScript that disables the script that does this. The only problem is, I already disable all the scripts on the site and when I do it still pops up. Is there a way that I can disable them ? I'm also using jQuery, so if I can do it through their interface, that would be great.
edit: Two perfect examples of such sites are daclips.in and gorrilavid.in
I have Adblocker Plus, and it seems like it is not recognizing "on Click" events as pop-ups, rather normal clicked links. And the logic is simple, no Adblocker will block you from clicking something intentionally and it (the link) opening in another window/tab.
The problem is the new window contains your clicked Url, while the original window/tab "Refreshes" (i.e. redirects) to another url.
Advertising companies seem to use this trick to bypass adblocking software.
Just ditch Chrome and use Firefox. Firefox already have built-in mouse-click popups. I think all addons like Adguard or Adblock can not disable mouse-click popups. If you use Firefox, these are the steps:
Type about:config in the browser's address bar and hit the enter key.
First time users need to confirm that they be careful on the next page.
Type or paste dom.popup_allowed_events into the search field.
The value of the preference highlights all events that are allowed to spawn popups.
Edit the value to remove some or all of the items here.
Why not just use a browser extension such as AdBlock?
https://chrome.google.com/webstore/detail/adblock/gighmmpiobklfepjocnamgkkbiglidom?hl=en
My go-to is right click and open in new tab. onClick events only happen with a left click. It's cumbersome but it still ends up being less work than closing the pop-up and whatever annoying prompts it may have.
I do not there's a practical solution for this.
Moreover, I think some of the answers here are missing the specific case in OP, where clicking anywhere on the page will cause the pop up to happen, not just clicking on links. According to this, neither right-clicking then choosing "open", nor noticing and blocking the target URL will help. I do not know of an add blocker that helps here either, because it's not trivial to meaningfully filter a click event that is taking place on the whole page object.
Only the solution provided by #Monkey would work, at the drawback of possibly breaking other things.

Use javascript to prevent context menu on CTRL+Leftclick

I am trying to allow my CMS users to click certain controls with ALT+CTRL both pressed, but this results in the context menu being shown, because CTRL+Leftclick simulates a Rightclick, at least here on Mac OSX (which is the primary OS of my client).
The question is: how can I stop the context menu from popping up but still make sure my click goes through to the element it is being triggered on?
I tried oncontextmenu="return false;" in my <body> for testing purposes. It would properly prevent the menu from popping up, but my click event would not go through.
As i was unable to properly solve this problem by fiddling around with the way the browser behaves in regard to the context menu, i went for a different approach and bound the META key instead of the CTRL key. Works well this way. I'll leave the q/a in for others.

IE6 connection interruption in Comet streaming

I am using a forever frame (COMET streaming technique) and in IE6 whenever a user clicks on a link (to even just basic JavaScript method) the connection is immediately dropped and has to be manually refreshed.
Has anyone come across a similar issue and / or know how to address it?
How to address it: return false from your event handlers (event.preventDefault for listeners etc) so that the link is not followed and so no navigation occurs on a simple left-click. Put all your logic in event handlers attached from script (and not javascript: URL, which are a horrible fragile hack that should never be used).
Further: if it's just a button that does some scripting when clicked, and doesn't actually point to anywhere usefully navigable, it shouldn't be marked up as a link. Ideally it should be a button (input or button with type="button"), which you can then use CSS to style like a link rather than a button if you prefer.
(Another approach, that requires less styling work but has accessibility drawbacks, is to do what SO does and just put an onclick event on a <span> or <div>.)

Categories