Autofocus on input field when div slides down

问题:

I have is a hidden div. When the button is clicked, the div slides down with an input field. How do I make this input field autofocus as soon as the div slides down? Thanks.

<input type="text" name="comment_field" id="comment_field" placeholder="Comment..." />

is what I have and is in a div

$("#status_comments_"+a).slideDown();
    $("#comment_field").focus();

I tried to use the above, but that didn't work.

回答1:

You can use slideDown's callback function which is executed when animation is complete.

$("#status_comments_"+a).slideDown(function(){
    $("#comment_field").focus();
});

Note that IDs must be unique, otherwise your ID selector only selects the first element with that specific ID. If input element is within the div tag you can also code:

$("#status_comments_"+a).slideDown(function(){
    $('input', this).focus();
});

回答2:

 $("#divId").show().focus();

document.getElementById('divID').focus();

回答3:

hidden field cannot gain focus ..so what you need to do is on click of button you have to show them .

$("#status_comments_"+a).show().slideDown();
    $("#comment_field").show().focus();

回答4:

$("#divID").focus();

or without jQuery:

document.getElementById('divID').focus();