What does jQuery .filter() method do?_问答_开发者

开发者 https://www.devze.com 2023-03-08 23:07 出处：网络

I used following code: var td = $( \'#job-tbody\'开发者_运维技巧 ).find( \'td[class=status]\' ).filter( \'#\' + object.id );

I used following code:

var td = $( '#job-tbody'开发者_运维技巧 ).find( 'td[class=status]' ).filter( '#' + object.id );

The problem with this is, when I call the function (containing this line of code) again for the second time, previously matched results are also returned. Why?

According to the documentation, it constructs a new jquery object that contains the filtered result.

It was live (JQuery) event problem...when I was adding request. Live event fires again and again....unnecessary fires...

Filter reduces the set of jQuery objects to only those that, in this case, match the selector. Because you're matching on an id, it should return at most one matching element.

EDIT: Make sure you turn caching off in the AJAX request -- it's likely you're getting cached request data either from the client or the server depending on how your caching is set up.

$.ajax({
     url: '/Helper/GetAllJobs',
     type: 'post',
     cache: false, // <-- add this
     ...

Function of .filter() - Reduce the set of matched elements to those that match the selector or pass the function's test.

Consider a page with a simple list on it:

We can apply this method to the set of list items:

 $('li').filter(':even').css('background-color', 'red');

The result of this call is a red background for items 1, 3, and 5, as they match the selector (recall that :even and :odd use 0-based indexing).

EXAMPLE

<!DOCTYPE html>
<html>
<head>
  <style>
  div { width:60px; height:60px; margin:5px; float:left;
        border:2px white solid;}
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <div></div>

  <div class="middle"></div>
  <div class="middle"></div>
  <div class="middle"></div>
  <div class="middle"></div>

  <div></div>
<script>

    $("div").css("background", "#c8ebcc")
            .filter(".middle")
            .css("border-color", "red");
</script>

</body>
</html>

OUTPUT This will highlight the boxes with red border that are in the middle. It means the left most and right most boxes wont be highlighed.