Javascript 在jquery自动完成中，如何显示标签并提交标签对应的id

我有一个使用jquery autocomplete的搜索字段。在这个文本框中，会下拉自动完成建议的员工姓名列表。但是当我提交表单时，我不希望将人员姓名与表单一起发送，我希望将员工id与表单一起发送。我如何做到

<input id="employee">
<input type="hidden" id="employee_id">

---

请帮助我。提前谢谢。

您是否控制源url的服务器端？如果是这样，我建议您使用

“value”

属性名称，而不是中所述的

“name”

。 否则，您可以就地修改该数组并动态添加

“value”

属性

这是我根据你的代码片段创建的。单击“发送”时，它崩溃了，我不知道为什么，但如果您查看开发人员的面板，网络请求正在通过参数：

employee[name]:Fred
employee[id]:first

JS代码：

var data = {
    json: "{\"employee\":[{\"value\":\"A\",\"id\":\"1\"},{\"value\":\"B\",\"id\":\"2\"},{\"value\":\"C\",\"id\":\"3\"}]}"
}


$(function () { 

$('#submit').click(function(){
    alert('Employee name = '+$('#employee_name').val()+' Employee id = '+$('#employee_id').val());    
});   

    $.ajax({
        url:"/echo/json/",
        data: data,
        type: "POST",
        success:function(data) {
            console.log(data);
            var arr = data.employee;
            $("#employee_name").autocomplete({
                minLength: 0,
                source: arr,
                select: function (event, ui) {
                    $("#employee_name").val(ui.item.value);
                    $("#employee_id").val(ui.item.id);
                    return false;
                }
            });
        }
    });
});

HTML代码：

<form>
    Employee name (Type like "A" or "B" or "C")<br>
    <input id="employee_name" name="employee_name">
    <br>
    Selected Employee id (hidden field):        
    <input type="text" id="employee_id" name="employee_id" readonly>
    <br>    
    <input type="button" value="Submit" name="submit" id="submit" onclick="check_fields()">

员工姓名（键入“A”或“B”或“C”）



所选员工id（隐藏字段）：

var data = {
    json: "{\"employee\":[{\"value\":\"A\",\"id\":\"1\"},{\"value\":\"B\",\"id\":\"2\"},{\"value\":\"C\",\"id\":\"3\"}]}"
}


$(function () { 

$('#submit').click(function(){
    alert('Employee name = '+$('#employee_name').val()+' Employee id = '+$('#employee_id').val());    
});   

    $.ajax({
        url:"/echo/json/",
        data: data,
        type: "POST",
        success:function(data) {
            console.log(data);
            var arr = data.employee;
            $("#employee_name").autocomplete({
                minLength: 0,
                source: arr,
                select: function (event, ui) {
                    $("#employee_name").val(ui.item.value);
                    $("#employee_id").val(ui.item.id);
                    return false;
                }
            });
        }
    });
});

<form>
    Employee name (Type like "A" or "B" or "C")<br>
    <input id="employee_name" name="employee_name">
    <br>
    Selected Employee id (hidden field):        
    <input type="text" id="employee_id" name="employee_id" readonly>
    <br>    
    <input type="button" value="Submit" name="submit" id="submit" onclick="check_fields()">