Как мне сфокусировать область ввода формы нажатием на кнопку формы? - PullRequest
1 голос
/ 12 мая 2019

Итак, у меня есть форма поиска в меню nav моего веб-сайта, и я хотел бы, чтобы кнопка поиска была нажата один раз, чтобы перенаправить ее на вход для поиска, а не в раздел архива / поиска сайт.

Я написал это:

function l() {
  document
    .getElementsByClassName("search-button")[0]
    .addEventListener("click", function(e) {
      var t = document.getElementsByClassName("search-input")[0];
      t.value.length < 2 && (e.preventDefault(), t.setFocus());
    });
}
l();
<form role="search" class="search-form" method="get" action=# placeholder="Searching for …" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Searching for …'">
  <input class="search-input" name="s" type="text" placeholder="Searching for ..." onfocus="this.placeholder=''" onblur="this.placeholder='Searching for ...'">
  <button type="submit" class="search-button" title="Search Blogs">
	</button>
</form>

Но, похоже, это мало что делает. Я думал, что заполнитель может быть засчитан как t.value.lenght> 2, но даже без заполнителя (ввод уже сфокусирован) кнопка перенаправляет на страницу поиска, которая должна быть остановлена ​​функцией e.preventDefault (), не так ли?

Может быть, есть ли CSS-способ остановки кнопки для ссылки на страницу поиска?

Спасибо

...