gpt4 book ai didi

javascript - 数据表清除搜索输入和正则表达式

转载 作者:行者123 更新时间:2023-12-03 07:44:25 25 4
gpt4 key购买 nike

我正在使用带有一些正则表达式过滤的数据表。除了一件小事外,一切都按预期进行。

当我搜索某个术语时,表格已成功过滤。但是,每当我单击搜索框以外的任何位置时,都会出现 \b添加到搜索词之前。

例如,搜索 Lon ,单击关闭搜索输入。您将看到它随后更改为 \bLon .

我不确定为什么会发生这种情况。也许有人可以看看我到目前为止的代码并发现我(显然)缺少的东西!

Jsfiddle here

到目前为止我的代码;

    // DataTable
var table = $('#example').DataTable();

$('.dataTables_filter input').unbind().bind('keyup change', function(e) {
var searchTerm = this.value.toLowerCase(),
regex = '\\b' + searchTerm + '';
table.rows().search(regex, true, false).draw();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"></script>
<link href="https://cdn.datatables.net/1.10.0/css/jquery.dataTables.css" rel="stylesheet"/>


<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>

<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$3,120</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Director</td>
<td>Edinburgh</td>
<td>63</td>
<td>2011/07/25</td>
<td>$5,300</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td>2009/01/12</td>
<td>$4,800</td>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>Javascript Developer</td>
<td>Edinburgh</td>
<td>22</td>
<td>2012/03/29</td>
<td>$3,600</td>
</tr>
<tr>
<td>Jenna Elliott</td>
<td>Financial Controller</td>
<td>Edinburgh</td>
<td>33</td>
<td>2008/11/28</td>
<td>$5,300</td>
</tr>
<tr>
<td>Brielle Williamson</td>
<td>Integration Specialist</td>
<td>New York</td>
<td>61</td>
<td>2012/12/02</td>
<td>$4,525</td>
</tr>
<tr>
<td>Herrod Chandler</td>
<td>Sales Assistant</td>
<td>San Francisco</td>
<td>59</td>
<td>2012/08/06</td>
<td>$4,080</td>
</tr>
<tr>
<td>Rhona Davidson</td>
<td>Integration Specialist</td>
<td>Edinburgh</td>
<td>55</td>
<td>2010/10/14</td>
<td>$6,730</td>
</tr>
<tr>
<td>Colleen Hurst</td>
<td>Javascript Developer</td>
<td>San Francisco</td>
<td>39</td>
<td>2009/09/15</td>
<td>$5,000</td>
</tr>
<tr>
<td>Sonya Frost</td>
<td>Software Engineer</td>
<td>Edinburgh</td>
<td>23</td>
<td>2008/12/13</td>
<td>$3,600</td>
</tr>
<tr>
<td>Jena Gaines</td>
<td>System Architect</td>
<td>London</td>
<td>30</td>
<td>2008/12/19</td>
<td>$5,000</td>
</tr>
<tr>
<td>Quinn Flynn</td>
<td>Financial Controller</td>
<td>Edinburgh</td>
<td>22</td>
<td>2013/03/03</td>
<td>$4,200</td>
</tr>
<tr>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>36</td>
<td>2008/10/16</td>
<td>$5,300</td>
</tr>
<tr>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>43</td>
<td>2012/12/18</td>
<td>$4,800</td>
</tr>
<tr>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>19</td>
<td>2010/03/17</td>
<td>$2,875</td>
</tr>
<tr>
<td>Michael Silva</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>66</td>
<td>2012/11/27</td>
<td>$3,750</td>
</tr>
<tr>
<td>Paul Byrd</td>
<td>Javascript Developer</td>
<td>New York</td>
<td>64</td>
<td>2010/06/09</td>
<td>$5,000</td>
</tr>
<tr>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>59</td>
<td>2009/04/10</td>
<td>$3,120</td>
</tr>
<tr>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>41</td>
<td>2012/10/13</td>
<td>$3,120</td>
</tr>
<tr>
<td>Dai Rios</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>35</td>
<td>2012/09/26</td>
<td>$4,200</td>
</tr>
<tr>
<td>Jenette Caldwell</td>
<td>Financial Controller</td>
<td>New York</td>
<td>30</td>
<td>2011/09/03</td>
<td>$4,965</td>
</tr>
<tr>
<td>Yuri Berry</td>
<td>System Architect</td>
<td>New York</td>
<td>40</td>
<td>2009/06/25</td>
<td>$3,600</td>
</tr>
<tr>
<td>Caesar Vance</td>
<td>Technical Author</td>
<td>New York</td>
<td>21</td>
<td>2011/12/12</td>
<td>$4,965</td>
</tr>
<tr>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Edinburgh</td>
<td>23</td>
<td>2010/09/20</td>
<td>$4,965</td>
</tr>
<tr>
<td>Angelica Ramos</td>
<td>System Architect</td>
<td>London</td>
<td>36</td>
<td>2009/10/09</td>
<td>$2,875</td>
</tr>
<tr>
<td>Gavin Joyce</td>
<td>Developer</td>
<td>Edinburgh</td>
<td>42</td>
<td>2010/12/22</td>
<td>$4,525</td>
</tr>
<tr>
<td>Jennifer Chang</td>
<td>Regional Director</td>
<td>London</td>
<td>28</td>
<td>2010/11/14</td>
<td>$4,080</td>
</tr>
<tr>
<td>Brenden Wagner</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>18</td>
<td>2011/06/07</td>
<td>$3,750</td>
</tr>
<tr>
<td>Ebony Grimes</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>48</td>
<td>2010/03/11</td>
<td>$2,875</td>
</tr>
<tr>
<td>Russell Chavez</td>
<td>Director</td>
<td>Edinburgh</td>
<td>20</td>
<td>2011/08/14</td>
<td>$3,600</td>
</tr>
<tr>
<td>Michelle House</td>
<td>Integration Specialist</td>
<td>Edinburgh</td>
<td>37</td>
<td>2011/06/02</td>
<td>$3,750</td>
</tr>
<tr>
<td>Suki Burks</td>
<td>Developer</td>
<td>London</td>
<td>53</td>
<td>2009/10/22</td>
<td>$2,875</td>
</tr>
<tr>
<td>Prescott Bartlett</td>
<td>Technical Author</td>
<td>London</td>
<td>27</td>
<td>2011/05/07</td>
<td>$6,730</td>
</tr>
<tr>
<td>Gavin Cortez</td>
<td>Technical Author</td>
<td>San Francisco</td>
<td>22</td>
<td>2008/10/26</td>
<td>$6,730</td>
</tr>
<tr>
<td>Martena Mccray</td>
<td>Integration Specialist</td>
<td>Edinburgh</td>
<td>46</td>
<td>2011/03/09</td>
<td>$4,080</td>
</tr>
<tr>
<td>Unity Butler</td>
<td>Senior Marketing Designer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/12/09</td>
<td>$3,750</td>
</tr>
<tr>
<td>Howard Hatfield</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>51</td>
<td>2008/12/16</td>
<td>$4,080</td>
</tr>
<tr>
<td>Hope Fuentes</td>
<td>Financial Controller</td>
<td>San Francisco</td>
<td>41</td>
<td>2010/02/12</td>
<td>$4,200</td>
</tr>
<tr>
<td>Vivian Harrell</td>
<td>System Architect</td>
<td>San Francisco</td>
<td>62</td>
<td>2009/02/14</td>
<td>$4,965</td>
</tr>
<tr>
<td>Timothy Mooney</td>
<td>Financial Controller</td>
<td>London</td>
<td>37</td>
<td>2008/12/11</td>
<td>$4,200</td>
</tr>
<tr>
<td>Jackson Bradshaw</td>
<td>Director</td>
<td>New York</td>
<td>65</td>
<td>2008/09/26</td>
<td>$5,000</td>
</tr>
<tr>
<td>Miriam Weiss</td>
<td>Support Engineer</td>
<td>Edinburgh</td>
<td>64</td>
<td>2011/02/03</td>
<td>$4,965</td>
</tr>
<tr>
<td>Bruno Nash</td>
<td>Software Engineer</td>
<td>London</td>
<td>38</td>
<td>2011/05/03</td>
<td>$4,200</td>
</tr>
<tr>
<td>Odessa Jackson</td>
<td>Support Engineer</td>
<td>Edinburgh</td>
<td>37</td>
<td>2009/08/19</td>
<td>$3,600</td>
</tr>
<tr>
<td>Thor Walton</td>
<td>Developer</td>
<td>New York</td>
<td>61</td>
<td>2013/08/11</td>
<td>$3,600</td>
</tr>
<tr>
<td>Finn Camacho</td>
<td>Support Engineer</td>
<td>San Francisco</td>
<td>47</td>
<td>2009/07/07</td>
<td>$4,800</td>
</tr>
<tr>
<td>Elton Baldwin</td>
<td>Data Coordinator</td>
<td>Edinburgh</td>
<td>64</td>
<td>2012/04/09</td>
<td>$6,730</td>
</tr>
<tr>
<td>Zenaida Frank</td>
<td>Software Engineer</td>
<td>New York</td>
<td>63</td>
<td>2010/01/04</td>
<td>$4,800</td>
</tr>
<tr>
<td>Zorita Serrano</td>
<td>Software Engineer</td>
<td>San Francisco</td>
<td>56</td>
<td>2012/06/01</td>
<td>$5,300</td>
</tr>
<tr>
<td>Jennifer Acosta</td>
<td>Javascript Developer</td>
<td>Edinburgh</td>
<td>43</td>
<td>2013/02/01</td>
<td>$2,875</td>
</tr>
<tr>
<td>Cara Stevens</td>
<td>Sales Assistant</td>
<td>New York</td>
<td>46</td>
<td>2011/12/06</td>
<td>$4,800</td>
</tr>
<tr>
<td>Hermione Butler</td>
<td>Director</td>
<td>London</td>
<td>47</td>
<td>2011/03/21</td>
<td>$4,080</td>
</tr>
<tr>
<td>Lael Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>21</td>
<td>2009/02/27</td>
<td>$3,120</td>
</tr>
<tr>
<td>Jonas Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>30</td>
<td>2010/07/14</td>
<td>$5,300</td>
</tr>
<tr>
<td>Shad Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>51</td>
<td>2008/11/13</td>
<td>$5,300</td>
</tr>
<tr>
<td>Michael Bruce</td>
<td>Javascript Developer</td>
<td>Edinburgh</td>
<td>29</td>
<td>2011/06/27</td>
<td>$4,080</td>
</tr>
<tr>
<td>Donna Snider</td>
<td>System Architect</td>
<td>New York</td>
<td>27</td>
<td>2011/01/25</td>
<td>$3,120</td>
</tr>
</tbody>
</table>

最佳答案

您正在使用regex = '\\b' + searchTerm + '';(可能用于删除空格)请删除它,只需使用regex = searchTerm;我们就可以搜索记录。

关于javascript - 数据表清除搜索输入和正则表达式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35267796/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com