Javascript &引用；意外标识符“；传递ajax调用产生的对象时

我正在使用一个绑定到select2插件的输入框来滚动我自己的typeahead实现。用户将输入一个手动电子邮件地址，然后使用onchange事件对电子邮件正则表达式进行验证，或者他们可以开始键入已绑定到其帐户的收件人的DisplayName。此列表将通过对控制器的ajax调用获取，然后控制器进行服务调用并检索数据，然后通过动态创建的listitems检索数据。如果用户单击或点击其中一个显示名称，则该收件人将被添加到所选收件人列表中，并从此点开始显示在select2中

typeahead和ajax调用工作正常，数据返回和显示正确；但是，我似乎无法将inital ajax调用返回的对象作为参数传递给函数。如果我尝试传递原始值，我会在控制台调试器中得到一个

“意外标识符”

错误；如果我尝试传入

JSON.stringify（value）

，我会得到

'unexpected token；'我可以通过传入接收者的ID属性（这很好，当我尝试传递复杂对象时，我遇到了困难）并再次重建对象来回退，但显然最好避免这样做，并避免进行另一次服务调用。提前谢谢

以下是脚本：

  $(document).ready(function () {
            $("#selectedRecipientList").select2({ tags: null, tokenSeparators: [",", " "] });
            $('.select2-input').keyup(function (e) {                    
                var currentString = $('.select2-input').val();
                $.ajax({
                    dataType: 'json',
                    url: '@Url.Action("RecipientTypeAhead", "RecipientManager")',
                    data: { query: currentString },
                    success: (function (data) {
                        $('#TypeAheadRecipientsList').empty();
                        $(data).each(function (index, value) {
                            $('#TypeAheadRecipientsList').append('<li onclick="AddRecipientFromPicker(' + JSON.stringify(value) + ')">' + value.DisplayName + '</li>');
                        });
                    })
                });
            });
        });

function AddRecipientFromPicker(someData){} //only ever reaches here if int primitive is passed in

$（文档）.ready（函数（）{
$（“#selectedRecipientList”）.select2（{tags:null，tokenseparator:[”，“，”]}）；
$（'.select2 input'）.keyup（函数（e）{
var currentString=$（'.select2 input'）.val（）；
$.ajax({
数据类型：“json”，
url:'@url.Action（“RecipientTypeAhead”，“RecipientManager”），
数据：{query:currentString}，
成功：（功能（数据）{
$（“#TypeAheadRecipientsList”）.empty（）；
$（数据）。每个（函数（索引、值）{
$（“#TypeAheadRecipientsList”）.append（“
“+value.DisplayName+”
”）；
});
})
});
});
});
函数AddRecipientFromPicker（someData）{}//只有在传入int原语时才会到达此处

下面是在ajax方法中返回对象后的外观示例：
{“AccountName”：“abc”、“DisplayName”：“abc”、“Email”：abc@test.net“，“Id”：94654}
您不能执行以下操作：

$(data).each(function (index, value) {
    $('#TypeAheadRecipientsList').append('<li onclick="AddRecipientFromPicker(' + JSON.stringify(value) + ')">' + value.DisplayName + '</li>');
});

另外请尽量不要使用内联事件处理程序

所以把这一切放在一起：

for(var index in data) {
   var value = data[index];
   var listItem = $('<li>' + value.DisplayName + '</li>');
   listItem.data('value', JSON.stringify(value)).on('click', function(){
       AddRecipientFromPicker($(this).data('value'));
   });
   $('#TypeAheadRecipientsList').append(listItem);
}

for（数据中的var索引）{
var值=数据[指数]；
var listItem=$（“
”+value.DisplayName+”
）；
listItem.data（'value'，JSON.stringify（value））.on（'click'，function（）{
AddRecipientFromPicker（$（this.data（'value'））；
});
$（“#TypeAheadRecipientsList”）.append（列表项）；
}
请不要使用内联事件处理程序。jQuery提供了更简洁的方法来使用@dcorder实现这一点，我非常确定。根据OP，每个
值
包含类似
{“AccountName”：“abc”，“DisplayName”：“abc”，“Email”：abc@test.net“，“Id”：94654}
并且点击事件的范围已完全确定。非常好，非常感谢！冷却期结束后，将立即接受。感谢您提供的关于编码风格的提示，非常感谢。由于所有单击处理程序都绑定在同一范围内，因此它们都捕获相同的
值
变量。是的，我也注意到了这一点，它总是将最后一个对象的值传递给函数。看起来它现在工作得很好，再次感谢你们两位的帮助
for(var index in data) {
   var value = data[index];
   var listItem = $('<li>' + value.DisplayName + '</li>');
   listItem.data('value', JSON.stringify(value)).on('click', function(){
       AddRecipientFromPicker($(this).data('value'));
   });
   $('#TypeAheadRecipientsList').append(listItem);
}