Jquery Autocomplete 未能获得焦点

Posted 2023-05-09

【中文标题】Jquery Autocomplete 未能获得焦点

【英文标题】：Jquery Autocomplete failing the focus

【发布时间】：2013-04-19 19:28:24

【问题描述】：

我正在使用自动完成功能，我想在列表中添加一个标题，这让我很复杂，我遇到了一些问题： 这是我的代码：

 var autocompleteCounselor = function () 

              $(this.el).find('.alternateCounselorAutocomplete').autocomplete(
                  minLength: 0,
                  source: this.counselorValidDelegates,
                  focus: function (event, ui) 
                    console.log(ui);
                      $(".alternateCounselorAutocomplete").val(ui.item.NAME());
                      return false;
                  ,
                  select: function (event, ui) 
                      onAutocompleteAlternateCounselorSelected.apply(_self, [event, ui, _self.counselorFullValidDelegates]);
                  
                ).data("ui-autocomplete")._renderMenu = function(ul, items)
                  var self = this;

                  ul.append("<li><span>Name</span>"+
                    "<span>Title</<span>" +
                    "<span>Phone</<span> "+
                    "<span>Location</<span>"+
                    "<span>Department</span></li>");
                    $.each(items, function(index, item)
                       /*return $("<li>")
                          .append("<div class='listcounsuler'><span>" + "<a>" + item.NAME() + "</a>" + "</span>" + "<span>" + item.TITLE() + "</span>" + "<span>" + item.PHONE() + "</span>" + "<span>" + item.LOCATION() + "</span>" + "<span>" + item.DEPARTMENT() + "</span>" + "</div>")
                          .appendTo(ul);*/
                           self._renderItem(ul, item);
                     );
                 /* ul.append("</tbody></table>");*/


                ;

               $('.alternateCounselorAutocomplete').autocomplete().data("ui-autocomplete")._renderItem = function (ul, item) 
                      return $("<li>")
                       .append("<div class='listcounsuler'><span>" + "<a>" +
                        item.NAME() + "</a>" + "</span>" + "<span>" + item.TITLE() +
                        "</span>" + "<span>" + item.PHONE() + "</span>" + "<span>" +
                        item.LOCATION() + "</span>" + "<span>" + item.DEPARTMENT() +
                        "</span></div>")
                    .appendTo(ul);
              ;

              $('.alternateCounselorAutocomplete').autocomplete("search", "");

              $(this.el).find('.counselorEdit').on('click', function () 
                  $('.alternateCounselorAutocomplete').autocomplete('close');
              );

          ;

菜单完美呈现，问题是当我将焦点放在 li 上时，在控制台中我看到错误：Uncaught TypeError: Cannot call method 'NAME' of undefined

我看到焦点项目未定义： 对象项目：未定义

函数渲染项也可以正常工作，我可以看到我想要的“li”。 我通过 _renderItemData 更改了 _renderItem 并且它继续发生，我尝试了几件事，但我无法得到解决方案。欢迎任何帮助。

问候

【参考方案1】：

我解决了它从 render_menu 调用 self._renderItemData..