jquery在表和标记数据中搜索

我该怎么做

我在同一个输入框中为type和filter table data（）以及type和tag数据编写了html和jquery代码， 但我想合并两者

我也有标记代码，但丢失了它的库名，所以我无法在JSFIDLE上添加它

i、 e当我键入搜索名称或单击表数据（01 name Last name等）时。数据应标记在上述标记区域（测试x、测试x）

下面是我在表中搜索的html和jquery代码

HTML

        <!-- table for search and filter start -->
    <label for="kwd_search">Search:</label> <input type="text" id="kwd_search" value=""/>


    <table id="my-table" border="1" style="border-collapse:collapse">
        <thead>
            <tr>
                <th>Name</th>
                <th>Sports</th>
                <th>Country</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Sachin Tendulkar</td>
                <td>Cricket</td>
                <td>India</td>
            </tr>
            <tr>
                <td>Tiger Woods</td>
                <td>Golf</td>
                <td>USA</td>
            </tr>
            <tr>
                <td>Maria Sharapova</td>
                <td>Tennis</td>
                <td>Russia</td>
            </tr>
        </tbody>
    </table>

    <!-- table for search and filter ends -->

---

由于您没有提供令牌小部件，而且您正在使用jQuery，我建议您使用UI小部件Select2。它似乎比所选择的（在评论中建议的）有更多的功能、更广泛的支持和更好的文档

不久前，我正在搜索一个类似的UI小部件。然而，由于某种原因，我的问题没有提出

---

如果您要求某人为您制定所有的实现代码，我是否可以建议您描述一下您的问题more@Ganesh，好的，我尝试添加标记工具，我有它的代码，但我想在上面的“搜索区域”中添加更多的东西，当我在其中键入一些东西时，表数据过滤（JSFIDLE中的演示）。在标记区域，我可以按类型在其中添加标记，但我必须做的是，当我单击表数据的数据并将数据添加到上面的标记区域时。只要输入是小写的，我就可以工作。。。将术语赋值更改为

var term=$（this.val（）.toLowerCase（）这是你丢失的库吗？你应该检查选择的插件。我是一个很好的插件。我不想，在你给定的URL@“对外部值变化做出反应”。但有一点是缺失的，根据我的图片，当用户按enter键时，文本怎么可能被标记？在你的链接中，它出现在标记区域，我希望它出现在搜索区域。
        /* jquery for search nad filter table start*/

    $(document).ready(function(){
        // Write on keyup event of keyword input element
        $("#kwd_search").keyup(function(){
            // When value of the input is not blank
        var term=$(this).val()
            if( term != "")
            {
                // Show only matching TR, hide rest of them
                $("#my-table tbody>tr").hide();
            $("#my-table td").filter(function(){
               return $(this).text().toLowerCase().indexOf(term ) >-1
            }).parent("tr").show();
            }
            else
            {
                // When there is no input or clean again, show everything back
                $("#my-table tbody>tr").show();
            }
        });
    });

    /* jquery for search nad filter table ends*/