Очистить ввод с помощью Google Custom Search

Question

Я перемещаю поиск по сайтам в пользовательский поиск Google.

Старый ввод для текста выглядит так:

<input type="text" value="Search this website..." name="s" id="searchbox" onfocus="if (this.value == 'Search this website...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search this website...';}" />

Теперь мне нужно иметь attr 'name' как 'q', вот так:

<input type="text" value="Search this website..." name="q" id="searchbox" onfocus="if (this.value == 'Search this website...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search this website...';}" />

Странно, что когда я меняю имя на q, я не могу очистить окно поиска по фокусу. Я что-то упускаю супер просто?

Answer 1

Вы также включили CSE JS? Скорее всего, это перезаписывает ваш фокус и обработчики размытия. Реализация по умолчанию (см. Верхнюю часть страницы) добавляет водяной знак под брендом Google.

Вы можете реализовать CSE без их JS, и в этом случае ваш код работает нормально:

<form action="http://www.google.com/cse" id="cse-search-box">
    <input name="cx" type="hidden" value="yoursearchid" />
    <input name="ie" type="hidden" value="UTF-8" />
    <input name="q" type="text" value="Search this website..." onfocus="if (this.value == 'Search this website...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search this website...';}" />
    <input name="sa" type="submit" value="Search" />
</form>

Answer 2

Я не знаю, почему это произойдет, но я рекомендую вам не использовать JavaScript для этого и позволить HTML выполнять свою работу с атрибутом placeholder:

<input type="text" placeholder="Search this website..." name="q" id="searchbox" />