2012-05-07 9 views
5

Estoy tratando de hacer una búsqueda y reemplazar con todas las instancias de la misma palabra, sin tener en cuenta las mayúsculas y minúsculas al usar .contains() pero parece que no está funcionando y es el caso sensible. Aquí está el código de lo que tengo ahora:Búsqueda y reemplazo de Jquery concontiene

<p>some text</p> 
<p>Some Text</p> 
<p>Some TEXT</p> 


jQuery.expr[':'].Contains = function(a, i, m) { 
     return jQuery(a).text().toUpperCase() 
      .indexOf(m[3].toUpperCase()) >= 0; 
     }; 
     jQuery.expr[':'].contains = function(a, i, m) { 
     return jQuery(a).text().toUpperCase() 
      .indexOf(m[3].toUpperCase()) >= 0; 
     }; 


     $('p').filter(":contains('some text')").each(function(){ 
      $(this).text($(this).text().replace("some text", "replace with new text")); 
     }); 

Esto sólo cambia el primer texto, debido a la misma causa se puede ver en el ejemplo en el violín de JS aquí http://jsfiddle.net/ka82V/

Respuesta

1

El problema no fue con el juego original, pero con la forma en que estaba reemplazando. Incluso si coincidió, el reemplazo no hizo nada porque su argumento "algún texto" no coincide con las otras variantes de caso.

Sin embargo, no creo que sea una buena idea anular el selector :contains de jQuery de esta manera. Usar un filtro basado en función es menos código y también deja jQuery inalterado.

Ver ejemplo de trabajo en: http://jsfiddle.net/Y6bhS/1/

$('p').filter(function() { 
    return /some text/i.test($(this).text()); 
}).each(function(){ 
    $(this).text($(this).text().replace(/some text/i, "replace with new text")); 
}); 
+0

Me gusta este y estoy de acuerdo con usted en que no debemos anular jQuery, sería una mala idea. Pero tiene una pregunta, ¿para qué sirve i.test? – Kevin

+0

'.test' es un método en el objeto' RegExp' en JavaScript, que ejecuta la expresión regular contra el argumento (en este caso '$ (this) .text()') y devuelve verdadero o falso en función de si coincide . El objeto 'RegExp' en este caso es en realidad un literal (al igual que" alguna cadena "es un literal' objeto de cadena '): '/ some text/i'. La parte 'i' dice que no distingue entre mayúsculas y minúsculas. –

+0

@ChrissPratt Veo gracias, todavía no he aprendido RegExp, supongo que es por eso que estaba teniendo problemas con la búsqueda y el reemplazo, pero está funcionando, muchas gracias – Kevin

2

De hecho, es 'reemplazar 'eso era sensible a mayúsculas y minúsculas Utilizar una expresión regular en su lugar:

text().replace(/some text/i, "replace with new text"));

DEMOhttp://jsfiddle.net/ka82V/1/

+0

+1 por señalar la causa raíz del problema. –

+0

@KyleMacey +1 muchas gracias Kyle! No pude averiguarlo – Kevin

2

Usted contiene ve bien. Tratar como a continuación como el propósito de utilizar .filter es encadenar

DEMO

jQuery.expr[':'].containsCI = function(a, i, m) { 
    return jQuery(a) 
     .text() 
     .toUpperCase() 
     .indexOf(m[3].toUpperCase()) >= 0; 
}; 

$('p').filter(":containsCI('some text')").text(function() { 
    return $(this).text().replace(/some text/i, "replace with new text"); 
}); 
+0

¿Qué pasa si el OP no quiere reemplazar TODO el texto en el elemento? –

+0

@KyleMacey Puede escribir el mismo código de reemplazo dentro de la declaración. Actualizado como así era en su publicación original. –

1
jQuery.expr[':'].Contains = function(a, i, m) { 
    return new RegExp(m[3], 'ig').test(jQuery(a).text()); // case insensitive replace 
}; 
jQuery.expr[':'].contains = function(a, i, m) { 
    return new RegExp(m[3], 'ig').test(jQuery(a).text()); // case insensitive replace 
}; 

$('p').filter(":contains('some text')").each(function() { 
    $(this).text($(this).text().replace(new RegExp($(this).text(), 'i'),"replace with new text")); 
}); 
Cuestiones relacionadas