JavaScript Clean URL Regex

Question

Estoy creando secciones de noticias de CMS con algunos campos, pero los que son especialmente necesarios para esta pregunta son los campos "Título" y "Referencia de URL". Cuando un usuario ingresa un título de artículo, quiero que Javascript/jQuery reemplace el texto del campo Título y cree un fragmento de URL "limpio" eliminando espacios y caracteres extraños con un guión (-).

p. Ej. FUN nuevo artículo

Kris' (título)

Kris-diversión-new-artículo (URL de referencia)

Aquí está el código, pero me parece que no puede encontrar la manera de reemplazar múltiples espacios y caracteres especiales

 
$('#title').keyup(function(){ 
    var ref = $(this).val().toLowerCase().replace('\ ','-'); 
    $('#reference').val(ref); 
}); 

también, como en el título "Kris' FUN nuevo artículo" la expresión regular deben sustituir "Kris" (cita y en el espacio) con Kris '-' (un guión). Esencialmente reconoce si hay dos caracteres especiales uno al lado del otro y reemplaza con un solo guión. NO como este "kris - fun-new-article".

Gracias de antemano

Answer 1

La respuesta de Samir Talwar es correcta, excepto que debe haber una bandera /.../g al final de la expresión regular para indicar una coincidencia global. Sin /.../g solo se reemplaza la primera coincidencia.

Torez, aquí es la versión actualizada de su función:

$('#title').keyup(function(){ 
    var ref = $(this).val().toLowerCase().replace(/[^a-z0-9]+/g,'-'); 
    $('#reference').val(ref); 
}); 

(. Lo sentimos, Samir, yo hubiera simplemente ha comentado tu respuesta, excepto que no tengo suficientes puntos de reputación aún)

Answer 2

Creo que quieres una clase de caracteres que contiene los caracteres especiales y el espacio a continuación, se pueden especificar una o más instancias de la clase de caracteres, así:

[specials charaters " "]+ 

y reemplazar ese partido con un guión

Answer 3

Necesita la bandera global - g - en la expresión regular, y algún tipo de cuantificador para los múltiplos (+ = una o más coincidencias, parece aquí).

así que algo como replace(/[' {insert further chars you care about here}]+/g,'-')

Answer 4

Probar:

function slug(str) { 
    if (!arguments.callee.re) { 
    // store these around so we can reuse em. 
    arguments.callee.re = [/[^a-z0-9]+/ig, /^-+|-+$/g]; 
    // the first RE matches any sequence of characters not a-z or 0-9, 1 or more 
    // characters, and gets replaced with a '-' the other pattern matches '-' 
    // at the beginning or end of a string and gets replaced with '' 
    } 
    return str.toLowerCase() 
    // replace all non alphanum (1 or more at a time) with '-' 
    .replace(arguments.callee.re[0], '-') 
    // replace any starting or trailing dashes with '' 
    .replace(arguments.callee.re[1],''); 
} 

slug("Kris' FUN new Article "); 
// "kris-fun-new-article" 

Answer 5

¿Cómo es esto?

str = str.toLowerCase().replace(/[^a-z0-9]+/, '-'); 

debe sustituir a todo lo que no es una letra o un número con un guión y el + significa que va a tomar más de una de ellas a la vez.