Jquery on click doesn't fire when blur is also bound

Question

My blur event fires but not my click event. If I remove the blur event code the click event works fine.

How do I change the order these events fire?

$.fn.autoComplete = function () {

    $(document).on('click', '#' + settings.resultsDivId + ' tr', function () {
            console.log('click fired');
            $('#' + settings.resultsDivId).hide();
    });

    this.on('blur', function () {
        console.log('blur fired');
        $('#' + settings.resultsDivId).hide();
    });

    function AutoComplete(term) {
        // ajax call stuff
    }
};

@ScottMarcus It's a typo in the question not in the code. Still doesn't work. — user3953989, Nov 06 '17 at 19:11
@user3953989 since its not working still, please post all relevant code, aka html — Carsten Løvbo Andersen, Nov 06 '17 at 19:13
If you remove the blur event then it works fine? Maybe the event fires so it hides the element with id set in `settings.resultsDivId` which make it impossible to click on? — Alon Eitan, Nov 06 '17 at 19:17
Include enough code for us to reproduce your error (HTML, CSS). — Scott Marcus, Nov 06 '17 at 19:19
@AlonEitan Correct. I believe this is exactly what's happening but not sure how to solve it — user3953989, Nov 06 '17 at 19:19
@user3953989 For that we'll have to see your html structure, as Scott mentioned in his comment — Alon Eitan, Nov 06 '17 at 19:21
@user3953989 Please also include example of how you use your code and explain what exactly are you trying to achieve, so you can get better answers to this question. There's a high chance for a solution, provided we have all the necessary details — Alon Eitan, Nov 06 '17 at 19:30
changing `click` to `mousedown` solved it. Apparently `click` fires after `blur` and this was why — user3953989, Nov 06 '17 at 19:40

score 1 · Accepted Answer · answered Nov 06 '17 at 19:40

1

Changing click to mousedown solved it. Apparently click fires after blur.

Blur event stops click event from working?

answered Nov 06 '17 at 19:40

user3953989

1,844
3
25
56

1

I was just about to post a solution, but if this works then great. My solution was to remove the blur event and instead check if the user clicked on the table or outside it and based on that to hide the table – Alon Eitan Nov 06 '17 at 19:44

Jquery on click doesn't fire when blur is also bound

1 Answers1