javascript输入淡入并直接聚焦

时间:2016-10-15 00:04:59

标签: javascript jquery input focus fadein

我有一个搜索框,通过点击搜索图标,输入扩展..我想在扩展后立即添加焦点..当前当框消费用户必须在输入中点击搜索...

<script>
$('#icon_search_expand').on('click',function(){
    if($('#form_group_id').css('display')!='none'){
        $('#icon_search_expand').fadeIn(100, 'swing').hide();
        $('.search_button').fadeIn(100, 'swing').siblings('div').hide();
    }else if($('#icon_search_expand').css('display')!='none'){
        $('#form_group_id').fadeIn(100, 'swing').siblings('div').hide();
    }
  if($('#form_group_id').css('display')!='none'){
        $('#icon_search_expand').hide();
        $('.search_button').fadeIn(100, 'swing');
    }
});
</script>

<div class="form-group" id="form_group_id" style="display:none;">
    <input class="form-control" placeholder="{% trans "Search..." %}" type="text" name="q" value="{{ request.REQUEST.q }}" id="form_control_id">
</div>
        <i class="fa fa-search" aria-hidden="true" id="icon_search_expand"></i>
        <button type="submit" class="search_button" id="search_button_id" aria-hidden="true" value="" style="display:none !important;">
         <i class="fa fa-search" id="fa-search-id" aria-hidden="true"></i>
        </button>

1 个答案:

答案 0 :(得分:2)

你是否尝试过焦点()

 $('input.form-control').focus();