Как реализовать выполнение поиска при нажатии на enter?

Question

[r03]

Код:

<form class="wrapper-simple" method="get" id="searchform" action="' . home_url( '/' ) . '"> 
            <input type="text" placeholder="Поиск по сайту..." name="s">
            <input type="submit" value="">
            <i class="fa fa-search" aria-hidden="true"></i>
        </form>

CSS

.wrapper-simple {
 text-align: center;
 margin: 0 auto;
 display: block;
 /*width: 60px;*/
 height: 35px;
 /*padding: 10px 5px;*/
 background: -webkit-gradient(linear, left top, left bottombottom, from(#f5fafe), to(#e2edf4));
 border-radius: 5px;

 #9bb6c9 0 1px 2px;
 position: relative;
}

.wrapper-simple input[type=submit] {
 margin-top: 0em;
 z-index: 2;
 position: relative;
 vertical-align: top;
 height: 35px;
 min-width: 55px;
 border-radius: 10px;
border: 1px solid rgba(244, 227, 217, 0.9);
background: rgb(244, 227, 217) none repeat scroll 0% 0%;
 box-shadow: inset rgba(255, 255, 255, .5) 0 0.1em 0.1em;
 cursor: pointer;
}

 .wrapper-simple input[type=submit]:active {
 box-shadow: inset rgba(0,0,0,.4) 0 1px 1px;
 }

 .wrapper-simple input[type=submit]:hover {
 background: -webkit-gradient(linear, left top, left bottombottom, from(#ffcb48), to(#ff9c23));
 }

.wrapper-simple input[type=text] {
 font-family: Arial;
 font-weight: bold;
 color: #1a3d51;
/* background: #d8e6ef;*/
 border-radius:2px;
 padding: 9px 10px 9px 10px;
 width: 250px;
 border: 0;
 font-size: 14px;
 text-shadow: rgba(255, 255, 255, 0.7) 1px 1px 1px;
 box-shadow: inset rgba(0,0,0,.4) 0 1px 1px;
 position: absolute;
 width: 1px;
 z-index: 2;
 padding-left: 5%;
 margin-left: .2em;
}

.wrapper-simple i {
 position: absolute;
 top: 0.8em;
/* left: 1.0em;*/
 z-index: 4;
 }

Скрипт

$('.wrapper-simple input[type=submit]').toggle(function(){

 $('.wrapper-simple').animate({'width':'1125px'})
 .end().find('.wrapper-simple input[type=text]').animate({'width': '100%', 'right':'96.3%', 'height':'35px'})
 .end().find('.wrapper-simple i').animate({'marginLeft': '-100%'})
 .end().find(this).animate({'marginLeft':'-95%'}).attr('value', 'X');

}, function() {

 $('.wrapper-simple').animate({'width':'60px'})
 .end().find('.wrapper-simple input[type=text]').animate({'width': '1px', 'right':'1em', 'height':'0px'})
 .end().find('.wrapper-simple i').animate({'marginLeft': '-45px'})
 .end().find(this).animate({'marginLeft':'0'}).attr('value', '');

return false;
});

При нажатии на enter поиск закрывается, а не переходит к странице поиска.
Как быть?

Answer 1

[polar-bear]

Может стоит тег форм применить для формы

<div class="wrapper-simple" role="search" method="get" id="searchform" action="' . home_url( '/' ) . '">

<form class="wrapper-simple" role="search" method="get" id="searchform" action="' . home_url( '/' ) . '">

Comments

[r03]

Извинтиляюсь, так и есть