可以将jQuery Quicksearch配置为仅返回完全匹配吗？

Question

我正在使用jQuery Quicksearch ，想知道是否有一种方法可以对其进行调整，使其仅返回搜索的完全匹配项。 任何帮助将非常感激。

谢谢

Answer 1

从jquery quicksearch插件的文档中，您似乎可以使用testQuery选项来定义一个函数，该函数指示是否应隐藏项目：

testQuery函数，用于告知是否应隐藏给定的项目。 它需要3个参数：

• 由“ prepareQuery”准备的查询

• 从“选择器”中剥离文本

• 可能被隐藏的元素

似乎在testQuery方法中接收到的query参数是一个数组。 因此，我们可以获取数组的第一项（这是输入中引入的文本），也可以使用prepareQuery选项按prepareQuery返回查询（字符串）：

prepareQuery: function(val) {
    return val;
}

现在，我们将查询参数作为字符串，如果您想要完全匹配，则可以尝试将testQuery与以下内容配合使用：

testQuery: function (query, txt, _row) {
    return query === txt;
}

使用这两个选项，我们将比较输入文本（这是testQuery的query参数）和该行的所有文本（包括所有单元格，这是testQuery的txt参数）。

如果要匹配任何单元格中的确切文本，则需要在selector选项中进行定义。

这是一个按电子邮件列匹配的小提琴 （这是因为我们传递的选择器选项等于th ）。 请注意，只有在引入的文本与单元格内容完全匹配时才会显示行。

Answer 2

您需要用'prepareQuery': function (val) { return new RegExp("^" + val + "$", "i"); }替换prepareQuery方法以与完整字符串匹配'prepareQuery': function (val) { return new RegExp("^" + val + "$", "i"); } 'prepareQuery': function (val) { return new RegExp("^" + val + "$", "i"); }

 $('input#id_search2').quicksearch('table#table_example2 tbody tr', { 'delay': 300, 'selector': 'th', 'stripeRows': ['odd', 'even'], 'loader': 'span.loading', 'bind': 'keyup click input', 'show': function () { this.style.color = ''; }, 'hide': function () { this.style.color = '#ccc'; }, 'prepareQuery': function (val) { return new RegExp("^" + val + "$", "i"); }, 'testQuery': function (query, txt, _row) { return query.test(txt); } }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.quicksearch/2.4.0/jquery.quicksearch.min.js"></script> <h3>Example with options — search with email regexp on &lt;th&gt; only</h3> <form action="#"> <fieldset> <input name="search" value="devo" id="id_search2" type="text"> <span class="loading" style="display: none;">Loading...</span> </fieldset> </form> <table id="table_example2"> <thead> <tr> <th width="30%">Email</th> <th width="10%">Id</th> <th width="10%">Phone</th> <th width="10%">Total</th> <th width="10%">Ip</th> <th width="10%">Url</th> <th width="10%">Time</th> <th width="10%">ISO Date</th> <th width="10%">UK Date</th> </tr> </thead> <tbody> <tr class="odd"> <th>devo@flexomat.com</th> <td>66672</td> <td>941-964-8535</td> <td>$2482.79</td> <td>172.78.200.124</td> <td>http://gmail.com</td> <td>15:10</td> <td>1988/12/14</td> <td>14/12/1988</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>henry@mountdev.net</th> <td>35889</td> <td>941-964-9543</td> <td>$2776.09</td> <td>119.232.182.142</td> <td>http://www.gmail.com</td> <td>3:54</td> <td>1974/1/19</td> <td>19/1/1974</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>christian@reno.gov</th> <td>60021</td> <td>941-964-5617</td> <td>$2743.41</td> <td>167.209.64.181</td> <td>http://www.dotnet.ca</td> <td>10:58</td> <td>2000/3/25</td> <td>25/3/2000</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>muffins@donuts.com</th> <td>17927</td> <td>941-964-9511</td> <td>$2998.18</td> <td>210.214.231.182</td> <td>http://google.se</td> <td>21:22</td> <td>1993/1/24</td> <td>24/1/1993</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>muffins@reno.gov</th> <td>76375</td> <td>941-964-2757</td> <td>$1836.09</td> <td>220.222.93.171</td> <td>http://www.samba.org</td> <td>15:22</td> <td>1988/4/4</td> <td>4/4/1988</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>mendez@gmail.com</th> <td>45834</td> <td>941-964-2575</td> <td>$2805.46</td> <td>228.170.245.253</td> <td>http://flexomat.com</td> <td>11:31</td> <td>1975/12/12</td> <td>12/12/1975</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>dev@gmail.com</th> <td>20022</td> <td>941-964-4967</td> <td>$3296.54</td> <td>175.248.70.240</td> <td>http://www.flexomat.com</td> <td>4:27</td> <td>2002/7/3</td> <td>3/7/2002</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>foo@polyester.se</th> <td>55977</td> <td>941-964-745</td> <td>$2953.73</td> <td>222.114.227.156</td> <td>http://www.donuts.com</td> <td>23:49</td> <td>1977/8/4</td> <td>4/8/1977</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>adam@aftonbladet.se</th> <td>38867</td> <td>941-964-6302</td> <td>$1949.27</td> <td>116.241.143.196</td> <td>http://flexomat.com</td> <td>23:35</td> <td>1995/7/27</td> <td>27/7/1995</td> </tr> <tr class="even"> <th>devo@donuts.com</th> <td>51426</td> <td>941-964-1234</td> <td>$1067.00</td> <td>88.96.149.82</td> <td>http://www.polyester.se</td> <td>15:17</td> <td>1986/1/5</td> <td>5/1/1986</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>henry@samba.org</th> <td>40859</td> <td>941-964-4856</td> <td>$3401.19</td> <td>68.152.250.74</td> <td>http://www.flexomat.com</td> <td>4:36</td> <td>1990/3/7</td> <td>7/3/1990</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>found@dotnet.ca</th> <td>23986</td> <td>941-964-2686</td> <td>$1393.52</td> <td>98.102.181.138</td> <td>http://lostnfound.org</td> <td>5:51</td> <td>1993/7/22</td> <td>22/7/1993</td> </tr> <tr class="odd" style="color: rgb(204, 204, 204);"> <th>carl@fish.org</th> <td>73392</td> <td>941-964-5792</td> <td>$3876.04</td> <td>246.234.182.243</td> <td>http://www.google.se</td> <td>6:52</td> <td>1984/7/14</td> <td>14/7/1984</td> </tr> <tr class="even" style="color: rgb(204, 204, 204);"> <th>found@mountdev.net</th> <td>03519</td> <td>941-964-1599</td> <td>$1176.48</td> <td>104.212.122.177</td> <td>http://donutsx.com</td> <td>18:52</td> <td>2000/8/6</td> <td>6/8/2000</td> </tr> </tbody></table>