How JQuery events triggered depending on Browser

Question

I have a checkbox "chk" in my code. I have onclick event for the checkbox and in jQuery I have (chk).change(function). The weird thing now is in FireFox the onclick function is executed first and then the change function is executed. But in Chrome/IE the change function is executing first and then the onclick function is executed. Can anyone help with why this is working so.

Answer 1

Your question is interesting and doing the test i noticed that even with a code similar to this the problem remains.
In Chrome the onclick event fires after onchange and also we revert the events in input type the problem remains

<input name="" type="checkbox" onChange="second()" onClick="first()"   >
<script type="text/javascript">
function first(){
    console.log('first')
    }
function second(){
    console.log('second')
    }
</script>

I tried to ask a question to the community (this)
but, until now, i haven't received answers.
The only answer that I can give you is that your problem could be solved by using onclick instead of onMouseDown

<input name="" type="checkbox" value="" id='chk'  onMouseDown="first()">
<script type="text/javascript">
function first(){
    console.log('first')
    }
$(document).ready(function(){
    $('#chk').on('change',function(){
        console.log('second')
    })
})
</script>

I'm sorry not to be able to help you more,
But that's all i could do, sorry for my english, and bye.