HTML5 <datalist> 关于chrome的问题

Question

我正在使用一个相互依赖的动态datalist，我的问题是在firefox中完美工作但不在google chrome中，因此加载5个中的第三个并不加载数据。

我的html因为它有很多代码：

<label for="cod_miembro" class="col-sm-2 control-label">Miembro</label>
    <div class="col-sm-2">
    <input type="text" class="form-control" size="25" maxlength="25" name="codmiembro"id="cod_miembro" list="miembros" placeholder="Miembro"/>
    <datalist id="miembros">
    </datalist>
</div>`

我加载Jquery：

$("#cod_miembro").ready(function(e) 
{
    var val = $(this).val();
    if(val != "") return;
    console.log(val);
    $.get(
    ruta, 
    {operacion:'BuscarMiembros'}, 
    function(resultado) 
    {
    var dataList_miembro = $("#miembros");
    dataList_miembro.empty();
    if(resultado.raiz.length) 
    {
    for(var i=0, len=resultado.raiz.length; i<len; i++) 
    {
    var opt = $("<option></option>").attr("value", "( "+resultado.raiz[i]['id_miembro']+" ) "+resultado.raiz[i]['nom_miembro']);
    dataList_miembro.append(opt);
    }
    $("#cod_departamento").attr('disabled', false);
}
},
"json");
});

在Firefox中工作得很好，但不是在chrome中。

谢谢你的帮助。

Answer 1

已解决，如果datalist标记的大小不符合您返回的数据，则数据列表将不会在Google Chrome上响应。 我已经解决了这个问题，将输入的大小从size =“25”扩展到size =“45”。