时间戳

首页 > 解决方案 > 是否可以为选择标签启用自动完成/自动填充？

html - 是否可以为选择标签启用自动完成/自动填充？

问题描述

浏览器中存储了特殊的个人信息，可以自动填写表格。例如，如果有一个包含第一个、最后一个、城市和州的表单，并且用户在输入第一个然后最后一个时选择自动完成，城市和州将自动填充。

但我认为这只适用于 HTMLinput标签。有什么方法可以使这种自动填充对 HTML 选择标签起作用？换句话说，如果我将状态输入从input标签更改为select标签，是否有任何方法可以使自动填充工作？

标签： htmlautocompletehtml-select

解决方案

因此，如果我理解正确，您希望在选择标签（下拉）上自动填充。我相信这必须通过 Javascript 来完成。HTML & CSS 不会让你管理这种行为。

您可以尝试以下方法：

HTML：

<input id="someinput">
<br>
<select id="states">
    <option value="1">NY</option>
    <option value="2">California</option>
    <option value="3">Florida</option>
    <option value="4">Boston</option>
    <option value="5">Texas</option>
</select>

CSS：

#states{
    height:100%;
}

JS：

$(function () {
    var opts = $('#states option').map(function () {
        return [[this.value, $(this).text()]];
    });
    $('#someinput').keyup(function () {
        var rxp = new RegExp($('#someinput').val(), 'i');
        var optlist = $('#states').empty();
        opts.each(function () {
            if (rxp.test(this[1])) {
                optlist.append($('<option/>').attr('value', this[0]).text(this[1]));
            }
        });

    });

});

查看http://jsfiddle.net/cse_tushar/VeLKW/227/

推荐阅读