Clever Geek Handbook

Why can't I focus the control I'm showing with slideDown ()?

I want to open a div with input inside when you click the button and set focus.

If I use show () it works, but if I use slideDown () focus is lost after the animation finishes . How can I prevent this?

Sample code:

$("document").ready(function(){
    $("#MyButton").click(function(e){
        e.preventDefault();
        $(".SlidingDiv").slideDown();
        $("#MyInput").focus();
    });
});

<input type="button" value="Click Me" id="MyButton" />
<div class="SlidingDiv" style="display:none;"><input type="text" id="MyInput" /></div>
+1


source to share


2 answers


Try the following:



$(function(){
    $("#MyButton").click(function(e){
        e.preventDefault();
        $(".SlidingDiv").slideDown(function(){
            // Callback function - will occur when sliding is complete.
            $("#MyInput").focus();
        });
    });
});
+10


source


I think you can only focus on the element once the DIV stops sliding completely?
not sure...



+1


source






More articles:


All Articles