Estoy ejecutando una secuencia de comandos cuando se hace clic en el ícono de búsqueda, la entrada de búsqueda se muestra con alternar, pero no puedo hacer que se ejecute, por lo que el enfoque automático de entrada está activo para que el usuario pueda escribir directamente en el cuadro de búsqueda.
$(document).ready( function(){ $("#velaSearchTop").each( function(){ $("#velaSearchIcon").click( function(){ $("#velaSearchbox").toggleClass("show"); }); $(".btn-close").click( function(){ $("#velaSearchbox").removeClass("show"); }); }); }); </script> <div id="velaSearchTop"> <span id="velaSearchIcon" class="fa fa-search"></span> <form id="velaSearchbox" class="formSearch" action="/search" method="get"> <input type="hidden" name="type" value="product"> <input class="velaSearch form-control" class="test" type="search" name="q" value="{{ search.terms | escape }}" placeholder="{{ 'general.search.placeholder' | t }}" autofocus /> <button id="velaSearchButton" class="btnVelaSearch" type="submit" > <span><i class="fa fa-search"></i></span> <span class="btnSearchText">{{ 'general.search.submit' | t }}</span> </button> <div class="btn-close"><span class="fa fa-close"></span></div> </form> </div>```Si está usando jquery.js, puede escribir así
$(function () { $("#velaSearchIcon").click(function () { $("#velaSearchbox").show(); $("input[name='q']").focus(); }); $(".btn-close").click(function () { $("#velaSearchbox").hide(); }); });