Как показать input при нажатии на submit?

Question

Есть поиск на сайте. По умолчанию выводится input, в который вводим текст для поиска и <button onclick="this.form.searchword.focus();"> - она отправляет форму.

Как при первом клике показать поле для поиска, а только при втором нажатии на submit отправлять форму?

<form>
<input name="searchword" id="mod-mls-searchword-mls_mod_120" maxlength="50" class="inputbox mls-query no-selector" type="text" placeholder="Search" autocomplete="off" onblur="if (this.value=='') this.value='Search';" onfocus="if (this.value=='Search') this.value='';" value="" required="">

<button onclick="this.form.searchword.focus();">Отправить</button>

</form>

Answer 1

const button = document.querySelector('button');

const onClick = ((isFirst, input) => (e) => {
    if (isFirst-- > 0) {
        input.style.display = 'inline-block';
        e.preventDefault()
    }
})(true, document.querySelector('input'));

button.addEventListener('click', onClick);

input {
  display: none;
}

<form>
<input type="text" placeholder="Search" required>
<button>Отправить</button>
</form>

БЛОГ НА HUSL

Как показать input при нажатии на submit?

Ответы (1 шт):