0

似乎某些文本输入会立即给我一种“下拉菜单”,其中包含我过去填写的值。其他时候没有。有没有办法可以在输入框中“鼓励”这种行为?为什么有时会发生有时不会?我是否需要为重复用户提供 cookie 或其他设备以确保他们具有此功能,或者是否有一些 jquery 选项?(因为我已经在使用它了)。

4

3 回答 3

1

这是一个想法。如果您想为页面上的每个输入字段提供特定的下拉值列表。然后使用一点 javascript、google 闭包编译器和为您的浏览器创建收藏夹/书签的知识,您可以在任何网页上添加类似的内容。

这是我在jsfiddle上的示例代码

HTML

<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" list="sitelist" />
<datalist id="sitelist">
    <option label="Lorem" value="Lorem">
    <option label="Ipsum" value="Ipsum">
    <option label="Dolor" value="Dolor">
</datalist>

Javascript

(function () {
    var d = "proin vestibulum ipsum vel tortor sollicitudin luctus".split(" "),
        l = document.createElement("datalist");

    l.id = "myDynamicDatalist";
    d.forEach(function (w) {
        var o = document.createElement("option");
        o.label = w;
        o.value = w;
        l.appendChild(o);
    });

    document.body.appendChild(l);

    Array.prototype.forEach.call(document.getElementsByTagName("input"), function (e) {
        if (e.list === null || e.list === "") {
            e.setAttribute("list", l.id);
        }
    });
}());

现在使用Google 的闭包编译器,您只需将选项设置为“简单”,就可以摆脱所有空格并将内容缩短为单行文本,您最终会得到这个。

(function(){var b=document.createElement("datalist");b.id="myDynamicDatalist";"proin vestibulum ipsum vel tortor sollicitudin luctus".split(" ").forEach(function(a){var c=document.createElement("option");c.label=a;c.value=a;b.appendChild(c)});document.body.appendChild(b);Array.prototype.forEach.call(document.getElementsByTagName("input"),function(a){(null===a.list||""===a.list)&&a.setAttribute("list",b.id)})})();

现在添加到该行javascript:并将其保存为收藏夹/书签,您已经创建了自己的javascript 书签

搏一搏。在 SO 上单击您的收藏夹/书签,然后双击搜索框,瞧!

您甚至可以使用 jquery 创建书签,而 jqueryui 意味着您可以使用它们的自动完成功能。

于 2013-04-29T18:52:32.630 回答
0

这是一个依赖于浏览器的功能。浏览器可能会查看文本输入字段的 ID 和/或名称并保存您输入的值。

由于您访问的网站上使用的输入字段的 ID/名称,它可能参差不齐。

于 2013-04-29T17:27:42.127 回答
0

浏览器会根据输入类型和名称为您提供过去填充的值。

因此,当有人在 examplea.com 中使用名为“login”的输入编写表单时,当您继续在 exampleb.com 上输入名为“login”的输入时,浏览器会检测到这一点,并且您已经为一个填写了一些信息之前输入名为“login”并显示一些选项。

这就是浏览器的行为。

对于 jQuery 选项,您可以在http://jqueryui.com/autocomplete/使用 jQuery UI 的自动完成功能

于 2013-04-29T17:28:34.070 回答