使用 Google 自定义搜索清除焦点上的输入

发布于 2024-09-03 01:31:20 字数 648 浏览 4 评论 0原文

我正在将网站搜索转移到谷歌自定义搜索。

旧的文本输入如下所示:

<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 时,我无法清除搜索框聚焦。我错过了一些超级简单的东西吗?

I'm moving a sites search over to google custom search.

The old input for text looks like this:

<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...';}" />

Now I need to Have the attr 'name' as 'q', like so:

<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...';}" />

The odd thing is that when I swap the name over to q, I'm unable to clear the search box on focus. Am I missing something super easy?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

甜中书 2024-09-10 01:31:20

你们还包括 CSE JS 吗?它很可能会覆盖您的焦点和模糊处理程序。 默认实现(请参见页面顶部)会添加 Google 品牌水印。

你可以在没有 JS 的情况下实现 CSE,在这种情况下你的代码可以正常工作:

<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>

Are you also including the CSE JS? Chances are it's overwriting your focus and blur handlers. The default implementation (see top of page) adds a Google-branded watermark.

You can implement CSE without their JS, and in that case your code works fine:

<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>
雪落纷纷 2024-09-10 01:31:20

我不知道为什么会发生这种情况,但我建议您不要使用 JavaScript 来执行此操作,而让 HTML 使用 placeholder 属性来完成此工作:

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

I don't know why that would happen, but I recommend you don't use JavaScript to do that and let HTML do it's job with the placeholder attribute:

<input type="text" placeholder="Search this website..." name="q" id="searchbox" />
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文