Question

我的数据列表包含id和groupName。 id为1,2,3,4,5 groupName为朋友，家庭，学校，大学，sivagiri。

我正在显示组名，用户选择组名意味着，我想获得选择组的ID。

我的代码是：

        <div class="input-group" style="margin-bottom: 5%">
            <span class="input-group-addon"> <i class="fa fa-users fa-fw"
                style="color: #ffcc33"></i></span> <input class="form-control"
                placeholder="Select Group" id="acqGroup" list="group" />
            <datalist id="group">
            </datalist>

        </div>

和jsp代码：

                        $.each(modelMap.distAcqGroupList, function(index, groupBO) {
                                $("#group").append($("<option></option>").text(groupBO.groupName));

                            });

现在数据列表正在加载完美，并显示选定的值，但我想获取所选值的ID。我试着

                 $("#acqGroup").blur(function() {           
                        var group = $("#acquaintanceGroup").val();
                        alert(group);

                    });

它只显示选择项目文本，我想要id，请帮帮我。

js fiddle

Answer 1

我的版本从datalist获取所选选项的类名。虽然有点凌乱

$("#account-list").blur(function() {
  var val = $("#account-list").val(); // get the value from #account-list

  // for loop
  var cn;
  var x = document.getElementById("account-ids").options.length; //get option total = 4
  for (var i = 0; i < x; i++) {
    var v = document.getElementById("account-ids").options[i].value; //get values by index
    if (val == v) { // compare option value from #account-list value
      cn = document.getElementById("account-ids").options[i].className; // get the cname
      i = x; // get ou of the loop
      // cn now holds the class name of that selected option from datalist
    }
  }
});

<div>
  <input list="accounts" id="account-list" />
  <datalist id="accounts">
    <option class="1" value="Juan De Lacruz"></option>
    <option class="2" value="Jan Doe"></option>
    <option class="3" value="Foo Bar"></option>
    <option class="4" value="Nme Name"></option>
  </datalist>
</div>

如何在jquery中获取datalist值？

1 个答案: