How to get div child with contains

Question

How to get div child with contains

Navigation

#1 by (2 votes)

0

In this case I want to test the div with class name , but after testing I want the CSS changes to be made in the div with class teste .

<div class="teste">
  <div class="name">um nome</div>
  <div class="outradiv">outra coisa</div>
</div>

  $(".text").on('keyup', function (e) 
  {
    $(".teste:contains('"+$(".text").val().toLowerCase()+"')").css("display", "block");
    $(":not(.teste:contains('"+$(".text").val().toLowerCase()+"'))").css("display", "none");
  });

jquery css

asked by anonymous 17.06.2017 / 18:47

1 answer

java.lang.NullPointerException: Attempt to invoke virtual method 'android.view.View android.view.View.findViewById (int)' on a null object reference Is it possible to connect to a MySql database without MySql.Data.dll?

score 2 · Accepted Answer

I think these selectors will shuffle the thing. You can do this simpler by checking if the element text contains the string you want.

Example:

$(".text").on('keyup', function(e) {
  var texto = this.value.toLowerCase();
  $(".teste").each(function() {
    var contem = $(this).text().indexOf(texto) > -1;
    $(this).find(".name").css("display", contem ? "block" : "none");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputclass="text">
<div class="teste">
  <div class="name">um nome</div>
  <div class="outradiv">uma coisa</div>
</div>

<div class="teste">
  <div class="name">outro nome</div>
  <div class="outradiv">outra coisa</div>
</div>

To hide .teste when typed anything that is in .name or .outradiv :

$(".text").on('keyup', function(e) {
  var texto = this.value.toLowerCase();
  $(".teste").each(function() {
    var contem = $(this).text().indexOf(texto) > -1;
    $(this).css("display", contem ? "block" : "none");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputclass="text">
<div class="teste">
  <div class="name">um nome</div>
  <div class="outradiv">uma coisa</div>
</div>

<div class="teste">
  <div class="name">outro nome</div>
  <div class="outradiv">outra coisa</div>
</div>