CODEWITHSUNDEEP
javascripthtml
rubo77
rubo77

Reputation: 20817

Call ondblclick without calling onclick-event

Is there a simple solution without jquery, inside HTML-tags, that will call the ondblclick without causing onclick to happen too?

This always closes the window although it should just show the alert: 

<a href="#" ondblclick="alert('dbl')" onclick="window.close();">X</a>

(it only works in a javascript popup, cause you cannot close the main window with window.close();)

Upvotes: 16

Views: 14764

Answers (6)

Meisner
Meisner

Reputation: 785

JS: 

var single;

HTML:

<a href="#" 
  ondblclick="single=0; alert('dbl')" 
  onclick="single=1; setTimeout(function(){
    if (single) window.close();
  },300);">X</a>

Upvotes: 1

Jack
Jack

Reputation: 131

I know it's not what you want to do for your question, but here's a way to use a click and a double easily:

If you need to select an object with a click (or save a variable for example), you can use javascript to call a function in a "href".

Then you can use the "ondblclik ()" to directly edit the registry, without clicking the edit button.

The function in the "href" is always executed, so do not test it with "alert ()", you will not get a double click, as the message window will open. It runs 2 times, then perform an action that can be a problem, but not to save or update variables.

function clickMe(c){
  var link = document.getElementById('link');
  link.innerHTML = "Clicked: "+c;
}
<a id="link" href="javascript:clickMe(1);void(0);" ondblclick="clickMe(2);">Click Me</a>

Upvotes: 0

rubo77
rubo77

Reputation: 20817

My guess is that every solution will also have the problem with the doubleclick timeout-length varying on user preferences described by Irvin Dominin aka Edward in the comment above:

From jQuery docs but related: "It is inadvisable to bind handlers to both the click and dblclick events for the same element. The sequence of events triggered varies from browser to browser, with some receiving two click events before the dblclick and others only one. Double-click sensitivity (maximum time between clicks that is detected as a double click) can vary by operating system and browser, and is often user-configurable."

I abandoned using doubleclick and used CTRL+click instead:

<a href="#" onclick="if(event.ctrlKey) { 
 alert('CTRL+Mouseclick'); return false; 
} else { window.close(); }">X</a>

see:

Catch onclick-event with CTRL pressed

Upvotes: 7

Irvin Dominin
Irvin Dominin

Reputation: 30993

I think this is a situation difficult to handle, you can use a timeout, but you can't be sure about the correct behaviour.

In the jQuery (but vanilla too) docs there is an important note, that tell us to avoid the handling of both single and double click:

It is inadvisable to bind handlers to both the click and dblclick events for the same element. The sequence of events triggered varies from browser to browser, with some receiving two click events before the dblclick and others only one. Double-click sensitivity (maximum time between clicks that is detected as a double click) can vary by operating system and browser, and is often user-configurable.

So in think that in short:

  1. if you can refactor your UI with a single handler
  2. alternatively use a timeout as suggested here, but will not be bulletproof

Upvotes: 2

Human Being
Human Being

Reputation: 8387

I have solved this with the below code,

<a id="press" href="javascript:void(0)" onclick="singleClick(event)"
    ondblclick="doubleClick(event)">Click here</a>

<div id="log"></div>

My JavaScript will be ,

    var timer;
    var status = 1;

    function singleClick(event) {
        status = 1;
        timer = setTimeout(function() {
            if (status == 1) {
                document.getElementById("log").innerHTML ='I  am single click !';
            }
        }, 500);

    }

    function doubleClick(event) {
        clearTimeout(timer);
        status = 0;
        document.getElementById("log").innerHTML = 'I  am a double  click!';
    }

Please let me know the status.Hope this helps.

Upvotes: 5

ʞɹᴉʞ ǝʌɐp
ʞɹᴉʞ ǝʌɐp

Reputation: 5650

From your code it seems you want both to work depending on number of clicks, then it would be better to introduce a short timeout between clicks and run the respective functions accordingly. You may look here.

Upvotes: 0

Related Questions