Já antecipo que estou aprendendo javascript – e evoluíndo bastante com meus estudos para o novo And After, e eis que trabalhando no novo sistema de buscas internos eu queria limpar a acentuação dos formulários de busca sem utilizar server-side, recorri ao Google para aprender o replace em Javascript.
Falhei em um primeiro momento, o replace do javascript faz a substituição apenas uma vez.
Exemplo que não funciona (com replace)
Se você quer retirar os acentos de "É fácil plantar árvores" e usar um replace para substituir "á" por "a" a substituição acontecerá somente no primeiro "á".
Como eu não estou (estava?) familiarizado com javascript, não sabia das manhas. É possível fazer com replace desde que você crie um pequeno loop.
Exemplo que funciona (com replace)
No exemplo abaixo eu criei uma função para retirar todos os espaços do valor de um input de texto, o exemplo facilita o entendimento de funciona o replace.
function retiraespaco(x) {
var campo = document.getElementById(x)
novo = novo.replace(" ","-");
campo.value = novo;
}
Para retirar todos os espaços eu criei um loop para cada caracter da variável (neste caso o valor do input X). Mas e para retirar todas as possibilidades de acentuação?
Retirando a acentuação de um Input de texto
Você poderia fazer um loop para cada possibilidade, mas seria um trabalhão e o código ficaria grande, recorri novamente ao Google e encontrei em um fórum uma função feita por um tal de Luís, que a seguinte:
function retira_acentos(palavra) {
com_acento = ´áàãâäéèêëíìîïóòõôöúùûüçÁÀÃÂÄÉÈÊËÍÌÎÏÓÒÕÖÔÚÙÛÜÇ´;
sem_acento = ´aaaaaeeeeiiiiooooouuuucAAAAAEEEEIIIIOOOOOUUUUC´;
nova=´´;
for(i=0;i<palavra.length;i++) {
if (com_acento.search(palavra.substr(i,1))>=0) {
nova+=sem_acento.substr(com_acento.search(palavra.substr(i,1)),1);
}
else {
nova+=palavra.substr(i,1);
}
}
return nova;
}
Ainda não fiz testes para entender como funciona o search no javascript, mas mesmo sem entender o funcionamento específico de cada linha do código é fácil implementá-lo para uso. No meu caso eu chamei a função para definir o valor de um input enquanto o usuário digita, retirando automaticamente os acentos do formulário de busca, segue o código do formulário
<form class="form_busca" method="get" action="busca.asp" name="busca"> <input type="text" onkeyup="this.value=retira_acentos(this.value);" class="texto_busca" value="BUSCA" id="query" name="query" /> <input align="absmiddle" type="image" src="https://andafter.org/beta/images/botoes/ok.png" name="Buscar" /> </form>
Pronto, quando o usuário digitar uma busca automaticamente a função irá retirar os assuntos. Não custa nada chamar a função quando o formulário for enviado, fiz testes e as vezes quando o conteúdo é colado no input os acentos podem "escapar", se chamar a função quando o form for enviado não tem erro!
Dúvidas, críticas e correções nos comentários! 😉