JQuery的自動完成功能上的Ajax加載的內容

我想使用JQuery的自動完成插件上的輸入框使用Ajax加載的：JQuery的自動完成功能上的Ajax加載的內容

我試圖做到這一點使用下面的代碼，但它只有在用戶點擊兩次工作到輸入：

$(document).ready(function() { 
    $('#auto').live('keydown', function(){ 
     $(this).autocomplete(
      "/autocomplete", 
      { 
      delay:10, 
      minChars:2, 
      matchSubset:1, 
      matchContains:1, 
      cacheLength:10, 
      onItemSelect:selectItem, 
      onFindValue:selectItem, 
      formatItem:formatItem, 
      autoFill:true 
     }); 
    }); 
});

你能告訴我，如果我的代碼有什麼問題嗎？

感謝，

來源

2011-07-04 Roch

爲什麼不試試$（「＃auto」）。focus（function（）{...}） ; ？ –

我不知道，但我想活（） - 功能在您的例子，使之適用你觸發後，才自動完成該keydown事件綁定。嘗試跳過現場（）和去只有自動完成：

$(document).ready(function() { 
    $('#auto').autocomplete(
     "/autocomplete", 
     { 
      delay:10, 
      minChars:2, 
      matchSubset:1, 
      matchContains:1, 
      cacheLength:10, 
      onItemSelect:selectItem, 
      onFindValue:selectItem, 
      formatItem:formatItem, 
      autoFill:true 
     } 
    ); 
});

來源

2011-07-04 22:43:35 johnhaggkvist

這不會起作用，因爲OP正嘗試將該小部件應用於通過AJAX加載的內容。 –

是的，我認爲這隻會在輸入字段加載頁面時起作用。 – Roch

同意@mnml這是常見的連接方式，在ajax內容不起作用的情況下 - 正是這是這個問題的主題。 –

$('#auto').live('keydown', function(){ 

    $("#auto").autocomplete({ 
    source: data, 
    minLength: 3 
    });

}）;

上面爲我工作...

來源

2011-09-14 10:36:57

這隻有在'minLength'> 1時纔有效。原因是第一個字符不能用於自動完成查詢，因爲這是觸發'keydown'並執行'autocomplete'控件註冊的字符。 –

有問題的解決方案有一個問題。僅在第二個字符後才執行自動完成，因爲第一個字符不能用於自動完成查詢，因此這是觸發並執行自動完成控制註冊的那個。

以下代碼將所有（匹配）現有和新創建（阿賈克斯）元素的focus事件，並執行autocomplete()註冊你點擊後或選項卡到輸入：在這個例子中，選擇查找所有

$(document).delegate(":input[data-autocomplete]", "focus", function() { 
    $(this).autocomplete({ 
     source: $(this).attr("data-autocomplete"), 
    }); 
})

具有屬性"data-autocomplete"元素，相同的屬性被用作源地址：

<input id="1" data-autocomplete="++URL++">

Importarnt： 根據不同的版本，您可以使用live()，delegate()或on()函數。這三個人的簽名略有不同，但很容易弄清楚他們如何映射到彼此：

$(selector).live(events, data, handler);    // jQuery 1.3+ 
$(document).delegate(selector, events, data, handler); // jQuery 1.4.3+ 
$(document).on(events, selector, data, handler);  // jQuery 1.7+

來源

2012-06-13 14:55:03

JQuery的自動完成功能上的Ajax加載的內容

回答

相關問題