jquery - 自定义我们的搜索栏

Question

如果您查看谷歌，他们的搜索栏上有一些出色的功能，但我想知道是否有人可以指出我复制其中一些功能的方向？

例子:

我们想在输入框的搜索框末尾添加X，向右浮动。 虽然不确定这是如何完成的，但我认为 css 是直接的，但不确定在不刷新页面的情况下执行此操作的脚本。

请有任何想法。

我们的搜索框是自动建议的，代码并不是真正需要 (html) 显示在这里，但如果人们需要查看我们的简单代码，可以张贴。此外想知道是否有人真的在输入字段中添加了类似于该图像的明确结果 X....

或者请张贴一些链接.. 请注意这里是我们的 html。

<input name="suburbs" id="suburbs" type="text" placeholder="eg: Apples" onkeyup="lookup(this.value);" onblur="fill();" autocomplete="off" /></input>
                            <!--added autosuggest-->
                                <div class="suggestionsBox" id="suggestions" style="display: none;">
                                    <div class="suggestionList" id="autoSuggestionsList">
                                        &nbsp;
                                    </div>
                                </div>
                            <!--//auto suggest end-->

Answer 1

如果您使用例如 firebug 检查 Google 页面的源代码，您会看到 x 不是输入字段的一部分，它是一个 x 包裹在下一个表列中的链接标记(输入与其他一些内容一起放在上一列中)。

只需在链接标签中添加一些 javascript 来清除输入并取消它的标准操作，您就可以获得完整的效果。