Question

当我搜索年龄将隐藏的名称时，我在实时搜索中遇到问题。我想只是名字可以搜索它。然后年龄没有出现。

请检查我的代码。

这是我的HTML

<table class="AvailableGroupLab availGrpLabs avalLabs">
    <tr>
        <th>Name</th>
        <th>Age</th>
    </tr>

    <tr>
    <td><span>wewe</span></td>
    <td>16</td>
    </tr>

    <tr>
    <td><span>Melvin</span></td>
    <td>18</td>
    </tr>

    <tr>
    <td><span>Marvin</span></td>
    <td>20</td>
    </tr>
</table>

这是我的jquery

  <script type="text/javascript">
var span = $(".AvailableGroupLab").clone().html();
function filter(element) {
    $('.AvailableGroupLab').html(span);
    var value = $(element).val().toLowerCase();
    $(".AvailableGroupLab span").each(function () {
        if ($(this).text().toLowerCase().search(value) == -1) {
            $(this).remove();
        }
    });
}
       </script>

Answer 1

尝试

function filter(element) {
    var $trs = $('.AvailableGroupLab tr').hide();
    var regexp = new RegExp($(element).val(), 'i');

    var $valid = $trs.filter(function () {
        return regexp.test($(this).find('td:first-child').text())
    }).show();

    $trs.not($valid).hide()
}

演示：Fiddle

Answer 2

    $("#src").keyup(function() {

    var val = $(this).val().toLowerCase();

    $(".name").hide();

       $(".name").each(function() {

        var text = $(this).text().toLowerCase();

         if(text.indexOf(val) != -1)
         {

             $(this).show(); 

         }

       });

    });

Answer 3

$（document）.ready（function（）{

/ ----在这里我们将GRABL产品列表中的FDE和隐藏DIV＆amp;价格---- /

public partial class MyControl2 : UserControl
{
    public MyControl2() { InitializeComponent(); }

    public string TextBox1Text
    {
        get { return this.textBox1.Text; }
        set { this.textBox1.Text = value; }
    }

    private void textBox1_TextChanged(object sender, EventArgs e)
    {
        if (Parent != null)
        {
            var control1 = Parent.Controls.OfType<MyControl1>().FirstOrDefault();
            if (control1 != null)
                control1.TextBox1Text = this.textBox1.Text;
        }
    }
}

/ ----在这里我们开始搜索功能---- /

    $(".col-md-9 .show_this_li").fadeOut(500);

/ ----在这里我们退出并隐藏了第1个DIV，其中GRABL列出了CATS标题---- /

    $("#src").keyup(function() {

    $(".col-md-9 .show_this_li").fadeIn(500);

/ ---获取搜索字段文本值---- /

    $(".col-md-9 .hide_this").fadeOut(200);

    $('.clear_src').html("<h6>Clear Search</h6>");

/ ----用LI产品检查搜索字段文本---- /

     var val = $(this).val().toLowerCase();

      $(".hover").fadeOut(200);

      $('.error').html("").fadeIn(100);

       $(".hover").each(function() {

        var text = $(this).text().toLowerCase();

/ ----在这里，当用户左侧搜索时，我们会将猫咪列入并显示列表字段和字段是空的---- /

     if(text.indexOf(val) != -1)
         {

             $('.error').html("<h6>Please Wait...</h6>").fadeOut(200);
             $(this).fadeIn(300); 

         }else {
                //$('.error').html($('<h5/>').text("No Data Found"));       
            }



       });

    });

使用Jquery进行实时搜索过滤

3 个答案: