Clever Geek Handbook

Fire event on .change () checkbox but * after checkbox is checked?

I am using jQuery to capture the click event on a checkbox and call a function.

My problem is this: the function I'm calling is relatively slow, so the user sees a visible delay before the checkbox is checked, which makes the interface weak and inelegant.

This fiddle demonstrates the problem: http://jsfiddle.net/ZkUgq/4/ or the code here:

function slowFunction() { 
   var mystr;
    for (var i = 0; i < 5000000; i++) { 
        mystr += ' ';
    }
}
$('#mycheckbox').click(function() { 
   slowFunction();
});

Is there a way to change the situation so that the click event still fires slowFunction

but doesn't delay the checkbox from appearing?

Ideally, what I need is an event onChecked

for the checkbox, but I don't know if this exists.

NB: the reason I am asking is because I am using the iPhone Checkbox and a relatively slow function that I call when my checkboxes makes it look sluggish and not iPhone-like :)

+3


source to share


2 answers


Why not postpone it with setTimeout

?

$("#mycheckbox").click(function() {
    setTimeout(slowFunction, 100);
}


Which will call your function 100ms after the click event ... adjust accordingly.

+7


source


settimeout will postpone the call to slowFunction until the checkbox check event is executed.



$('#mycheckbox').click(function() {     
       setTimeout(slowFunction,500); 
});
+1


source






More articles:


All Articles