如何定義上下文以使用jquery Quicksearch進行搜索？

我在定義插件的上下文以進行搜索時遇到問題。如何定義上下文以使用jquery Quicksearch進行搜索？

的事情是，我有多個輸入的文本（用戶可以添加更多的按鈕），我做這樣的事情：

$('.inp_txt').quicksearch('ul.myList li');

對於每個輸入文本，我有一個列表，就像一個選擇框，在輸入時顯示結果。問題是，當用戶開始在第一個輸入上輸入內容時，插件會顯示所有其他輸入中的所有.myList。我需要它僅顯示用戶所在的輸入文本中的列表。

我想我不能爲每個列表使用不同的類併爲每個列表調用插件，因爲更多的輸入可以在導航時通過JS添加。

是否有無論如何我可以定義的上下文，使用$(this)或其他東西，所以插件知道它只在該特定列表中搜索？

謝謝！

來源

2012-12-03 Rafaelius

您遇到的問題是，你的語法適用在你選擇一個插件實例到所有項目。

$('.inp_txt').quicksearch(...)就像是打電話('.inp_txt').click(...) - 你會得到一個處理程序，用於匹配每個元素。

要解決這個問題，你需要做的是這樣的：通過每個.inp_txt項目

$('.inp_txt').each(function (index, value) { 
    var $input = $(value); 

    // Get a reference to the list you want for this input... 
    var $quickSearch = $('ul.myList li'); 

    $input.quicksearch($quicksearch); 
});

這段代碼迴路，並應用了獨特的處理程序爲每一個。

在您的場景中，聽起來您只有一個ul.myList - 這可能是您總是看到相同列表的另一個原因。如果是這樣的話，你可能會考慮像...

<div> 
    <input type="text" class="inp_txt" /> 
    <ul class="myList"> 
    <li>...</li> 
    </ul> 
</div>

然後你可以在上面的代碼適應這樣的：

$('.inp_txt').each(function (index, value) { 
    var $input = $(value); 
    var $quickSearch = $input.siblings('ul.myList'); 

    $input.quicksearch($quicksearch); 
});

這樣，你得到的唯一列表每個文本框。顯然，我不知道你的情景的其餘部分是否知道你的應用程序邏輯中這是否可能 - 但也許。

最後 - 當您添加新控件時，您需要調整創建它們的代碼，以便您也爲它們附加新的處理程序。喜歡的東西：

function addInput(/*... params ...*/) { 
    /* Do your logic to create the control */ 
    $newInput.quicksearch($newList); 
}

在上面的代碼，很顯然，假設您將創建一個$newInput元素這將是您的新<input type="text" /> - 和一個新的列表，你會打電話$newList。

我希望這有助於 - 如果沒有，請隨時張貼一些評論和澄清，我會盡量調整我的答案。

來源

2012-12-03 17:56:10

如何定義上下文以使用jquery Quicksearch進行搜索？

回答

相關問題