Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

212
Views
Atributo de datos de búsqueda del elemento con Jquery, con coincidencias parciales

Estoy creando un filtro de elementos, usando un campo de entrada y el evento on("keyup"). Se parece a esto:

 $("#inputFilter").on("keyup", filterPrograms);

Está funcionando bien para encontrar elementos dentro de una clase, como este:

 <h6 class="programName">Science</h6>

Sin embargo, dentro de algunos de esos H6, he agregado un atributo de datos, así:

 <h6 class="programName" data-tag="indigenous interdisciplinary ">Aboriginal Studies</h6>

¿Cómo puedo modificar el siguiente código para filtrar tanto el texto de la clase (actualmente en funcionamiento) como el contenido de la etiqueta de datos? Esto simplemente oculta el bloque principal '.mix' siempre que una coincidencia parcial no sea cierta. Aquí está mi función:

 function filterPrograms(event) { // Retrieve the input field text var filter = $('#inputFilter').val(); // Loop through the blocks $(".programName").each(function(){ // this part isn't working!! dataResult = $(this).is('[data-tag*='+filter+']') < 0; // If the item does not contain the text phrase, hide it textResult = $(this).text().search(new RegExp(filter, "i")) < 0; if (textResult || dataResult) { $(this).closest(".mix").hide(); } else { $(this).closest(".mix").show(); } }); }

Ahora, estoy bastante seguro de que es porque .is() nunca coincidirá por completo, por lo que necesito una coincidencia parcial. En el ejemplo anterior, escribir "indi" debería proporcionar un resultado positivo contra el contenido del atributo de etiqueta de datos; esto no funciona Escribir "abo" coincide con textResult y funciona bien.

Sé que me estoy perdiendo algo, pero leer la documentación (y SO) sobre esto no está ayudando. Gracias por adelantado.

Editar: aquí está la función de trabajo con la solución de @Triptych:

 $(".programName").each(function(){ // If the item does not contain the text phrase hide it dataResult = $(this).is('[data-tag*="'+filter+'"]'); textResult = $(this).text().search(new RegExp(filter, "i")) < 0; if (textResult && !dataResult) { $(this).closest(".mix").hide(); // Hide the item if there are no matches } else { $(this).closest(".mix").show(); // Show the item if there are matches } });
about 4 years ago · Santiago Trujillo
1 answers
Answer question

0

Bueno, por un lado, no puedes comparar el resultado de .is() con 0 de esa manera. is() devuelve un valor booleano.

Así que cambia esto.

 dataResult = $(this).is('[data-tag*='+filter+']') < 0;

A esto.

 dataResult = $(this).is('[data-tag*="'+filter+'"]');

Tenga en cuenta que también cité la cadena para la coincidencia de atributos, lo que permitirá que la consulta incluya espacios.

about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!