How To Fix My Jquery Bug?

The script is on jsfiddle here : CODE What it does at the moment: it's a form that have two types of URL field textarea and input, it converts the texts in those fields to a link t

Solution 1:

A double-click is always predeeded by the following chain of events:

mousedown, mouseup, click, mousedown, mouseup, click, dblclick

You can make your click-events wait and check if a double-click event happened afterwards. setTimeout is your friend. Be sure to copy any data you need from the event object passed to your handler. That object is destroyed after the handler finished - which is before your delayed handler is invoked.

---

You can manually dispatch a double click event to prevent click-events from being executed prior to them. See the Fiddle

// ms to wait for a doubleclickvar doubleClickThreshold = 300;
// timeout containervar clickTimeout;
$('#test').on('click', function(e) {
    var that = this;
    var event;

    if (clickTimeout) {
        try {
            clearTimeout(clickTimeout);
        } catch(x) {};

        clickTimeout = null;
        handleDoubleClick.call(that, e);
        return;
    }

    // the original event object is destroyed after the handler finished// so we'll just copy over the data we might need. Skip this, if you// don't access the event object at all.
    event = $.extend(true, {}, e);
    // delay click event
    clickTimeout = setTimeout(function() {
        clickTimeout = null;
        handleClick.call(that, event);
    }, doubleClickThreshold);

});

functionhandleClick(e) {
    // Note that you cannot use event.stopPropagation(); et al,// they wouldn't have any effect, since the actual event handler// has already returnedconsole.log("click", this, e);
    alert("click");
}

functionhandleDoubleClick(e) {
    // this handler executes synchronously with the actual event handler,// so event.stopPropagation(); et al can be used!console.log("doubleclick", this, e);
    alert("doubleclick");
}

Solution 2:

jsfiddle refuses to load on my connection for some reason, so cant see the code. Based on your explanation i suggest you look into event.preventDefault to add more control on what should happen on your click events. This could be used in conjunction with @rodneyrehm's answer.

Solution 3:

Refer to my previous answer.

For your quick reference, I have pasted my answer here

$('.a0 a').click(function(){
    var href = $(this).attr('href');

    // Redirect only after 500 millisecondsif (!$(this).data('timer')) {
        $(this).data('timer', setTimeout(function() {
            window.open(href, '_blank')
        }, 500));
    }
    returnfalse; // Prevent default action (redirecting)
});

$('.a0').dblclick(function(){
    var txt = document.createElement('div');
    $.each($(this).find('a'), function(i, val) {
        clearTimeout($(val).data('timer'));
        $(val).data('timer', null);
        $(txt).append($(val).text()); 
        $("<br>").appendTo(txt);
    });
    var content = $(this).parent().find('input,textarea');
    var text = "";
    $.each($(txt).html().split("<br>"), function(i, val) {
        if (val != "")
            text += val + "\n"; 
    });
    $(content).html(text);
    $(this).hide();
    $(content).show().focus();
})


$('#url0, #url1, #url4').each(function(index, element) {
    $(element).blur(function(){
        if ($(this).val().length == 0)
            $(this).show();
        else
        {
            var ele = this;
            var lines = $(ele).val().split("\n");
            var divEle = $(ele).hide().prev().show().empty();
            $.each(lines, function(i, val) {
                $("<a />").html(val).attr({
                    'href': val, 
                    'target': '_blank'}).appendTo(divEle);
                $("<br/>").appendTo(divEle);
            });
        }
    });
});
​