如何使這個鏈接在JQuery UI自動完成中可點擊？ Uncaught TypeError

Question

我正在嘗試使用Jquery UI自動完成插件，並且我想在建議框中使用可點擊的鏈接呈現一些html。在HTML似乎呈現正常，但是當我點擊的鏈接，他們不工作，我在開發者日誌中得到：

jquery-ui.min.js:239Uncaught TypeError: Cannot call method 'data' of null 

Uncaught TypeError: Cannot call method 'data' of null 
a.widget._create.menu.a.addClass.appendTo.mousedown.menu.selectedjquery-ui.min.js:239 
a.Widget._triggerjquery-ui.min.js:23 
a.widget.selectjquery-ui.min.js:252 
a.widget._createjquery-ui.min.js:247 
f.event.handlejquery.min.js:17 
f.event.add.k.i.handle.k jquery.min.js:16 

我使用的HTML和jQuery側，語法如下代碼Haml是Rails中的一員。在第一個腳本標記中，我只是定義了一個模板，然後使用Underscore.js進行渲染。

This question似乎參考了類似的問題，但我不明白的答案"I think autocomplete uses an <a> for the element that provides the click event. In that case, you'll need to unset that click handler"

我會很感激的任何指導！它已經被困在這2天了。謝謝！

= text_field_tag :search, nil, :class => "jq_watermark", :id => "product-search-input", :title => "Keywords, Tags, Items, SKU..." 

%script(type="text/html" id="product-autocomplete-result-template") 
    .cell.img 
    %img(src='{{ main_image_thumb }}') 
    .cell 
    %h2= link_to '{{ label }}', CGI::unescape(product_path('{{ id }}')) 
    .clear 
    = link_to '{{ customer_count }} people have this', '#' 
    %span Rating {{ rating }} 
    %div{:id => "stars-wrapper-{{ id }}"} 
     %select= options_for_select([1, 2, 3, 4, 5]) 
    %a(href='http://www.google.com') 
     Click Me 
    .cell 
    = link_to "I have this", '#', :class => "button" 
    = link_to "I want this", '#', :class => "button" 

:javascript 
    $(document).ready(function(){ 

    $.ui.autocomplete.prototype._renderItem = function(ul, item) { 
     var template = $('#product-autocomplete-result-template').html(); 
     var parsed_template = _.template(template, item); 
     var target_option = 'value="' + item.rating + '"'; // do simple string replace to select option, as I can't get Jquery 
     var selected_option = target_option + ' selected="selected"'; 
     var autocomplete_html = parsed_template.replace(target_option, selected_option); 
     var returnVal = $("<li></li>") 
     .data("item.autocomplete", item) 
     .append('<a>' + autocomplete_html+'</a>') 
     .appendTo(ul); 
     $("#stars-wrapper-"+item.id).stars({ inputType: "select", disabled: true }); 
     return returnVal; 
    }; 

    $('#product-search-input').autocomplete({ 
      delay: 50, 
     source: function(request, response) { 
     $.ajax({ 
      url: "#{search_products_path}", 
      dataType: 'json', 
      data: { term: request.term }, 
      success: function(data) { 
      if (data.length < 1) { 
       console.log("Juuusstt right"); 
       // show submit button 
      } else { 
       console.log("Too long"); 
       // hide submit button 
      } 
      response(data); 
      } 
     }); 
     }, 
     select: function(event, ui) { 
     console.log(ui.item ? 
      "Selected: " + ui.item.label : 
      "Nothing selected, input was " + this.value); 
     } 
    }) 
    }); 

Answer 1

我找不到任何證據證明這是沒有猴子補丁的jQuery的很大一部分是可行的。然而，YUI3運作得非常好。沒有瞎搞周圍必要

http://developer.yahoo.com/yui/3/autocomplete/

Answer 2

林猜你已經找到了解決方案，但更好的後期則從來沒有。

我知道這不是最佳的解決方案，但它的工作原理。

$(".yourLink").live('click', function() { 
    var yourLinkHref= $(this).attr('href'); 
    window.location = yourLinkHref; 

}); 

希望它能幫助:)