2

Gostaria de implementar um evento que corrigisse dados que viessem fora do padrão, substituindo o separador por : e colocando as letras em minúsculo. Por exemplo, o usuário digita 00-25-66-F0-21-11, seria corrigido para 00:25:66:f0:21:11.

Meu código atual:

<html>

<form name="muda">MAC: <input type="text" name="mac" id="macad" onmouseover="capturamac()" /></form>

<script>
function capturamac(){
    var macadd = toString(muda.mac.value);
    var corrige = macadd.split('-').join(':').toLowerCase();
    document.getElementById('macad').value = toString.corrige;
}
</script>

</html>
3
  • e qual o problema com o seu código? não está certo??
    – rLinhares
    4/12/2018 às 17:23
  • Está dando [object Undefined] 4/12/2018 às 17:24
  • 1
    O toString está no lugar errado. Seria: muda.mac.value.toString(). Se bem que nem precisa converter pra string, já que o valor já parece ser uma string. Mas a resposta do Sorack já disse tudo :D
    – Sam
    4/12/2018 às 17:53

2 Respostas 2

2

Uma alternativa é usar split para quebrar a string em um array, e em seguida usar join para gerar uma string novamente.

O parâmetro do split é o separador (no caso, -). Com isso, será gerado um array com as partes do endereço (00, 25, etc). E o parâmetro do join é o novo separador (no caso, :), assim as partes do array serão unidas em uma única string, com as partes separadas por :. Por fim, usei toLowerCase() para transformar as letras em minúsculas:

let endereco = '00-25-66-F0-21-11';

let correto = endereco.split('-').join(':').toLowerCase();

console.log(correto); // 00:25:66:f0:21:11


Como você só está trocando um único caractere por outro, acho esta solução mais fácil. Mas a solução do @Sorack com regex também é válida, e eu usaria ela para casos mais complexos (quando o separador não é apenas um único caractere, ou pode ser "qualquer caractere minúsculo ou dígitos", ou qualquer outro critério que seja mais fácil fazer com regex).


Quanto ao erro do Object undefined, ele ocorre por causa da forma que você está tentando capturar o valor do input e depois setá-lo de volta.

Por exemplo, chamar toString é desnecessário, pois o valor já é uma string. E onmouseover chama a função de conversão quando o mouse é colocado sobre o campo. O certo seria converter o valor somente depois que o foco é retirado do campo, e para isso usa-se onblur.

O código corrigido fica assim:

function capturamac(){
    var macadd = muda.mac.value;
    var corrige = macadd.split('-').join(':').toLowerCase();
    muda.mac.value = corrige;
}
<html>

<form name="muda">MAC: <input type="text" name="mac" id="macad" onblur="capturamac()" /></form>

</html>

8
  • Não estou conseguindo "imprimir" de volta o valor corrigido. Está dando [object Undefined]. É um campo input. 4/12/2018 às 17:41
  • @AndersonFidelis Então há algum problema em outro lugar (e não na conversão em si). Eu sugiro que você edite sua pergunta colocando exatamente o código que gera o erro (e em qual linha o erro ocorre).
    – hkotsubo
    4/12/2018 às 17:44
  • Esse é o problema! não apresenta erro! Já converti para String, mas não consigo achar um jeito de corrigir 4/12/2018 às 17:52
  • Se está dando Object Undefined é porque está referenciando algo que não existe. Ou é muda, ou muda.mac, ou document.getElementById('mac'), ou algum outro. Algum deles não existe. Verifique no console (F12 no Chrome e Firefox) se esses elementos existem na sua página
    – hkotsubo
    4/12/2018 às 17:55
  • Pois é @hkotsubo, minha implementação é em iframe. Quando peço para verificar o código fonte ele não mostra o id. 4/12/2018 às 18:02
1

Primeiro utilize toLowerCase na sua string:

toLowerCase

O método toLowerCase() retorna a string chamada convertida para minúsculo.

Depois utilize replace:

replace

 str.replace(regexp|substr, newSubStr|function)

O método replace() retorna uma nova string com algum ou todas as combinações do padrão substituído por um substituto. O padrão pode ser uma string ou uma RegExp, e o substituto pode ser uma string ou uma função a ser chamada por cada combinação.

Note que o replace pode receber uma string como segundo parâmetro, porém caso seja fornecido este tipo de dado, apenas a primeira ocorrência será substituída. Portanto recomendo a utilização de uma expressão regular:

/-/g

Onde será correspondido o caractere literal - e utilizado o modificador g (global).

Aplicando isso em uma função de conversão:

const converter = entrada => entrada.toLowerCase().replace(/-/g, ':');

console.log(converter('00-25-66-F0-21-11'));

A expressão acima procura o caractere literal - e utiliza o modificador g (global).

6
  • Obrigado Sorack, só não entendi o console.log 4/12/2018 às 17:28
  • @AndersonFidelis apenas para mostrar a informação mesmo, você pode substituir pela atribuição no campo
    – Sorack
    4/12/2018 às 17:30
  • Perfeito, neste caso eu pus console.log(converter(muda.mac.value)) e deu [object Undefined] 4/12/2018 às 17:44
  • @AndersonFidelis Qual o id do campo?
    – Sorack
    4/12/2018 às 17:45
  • @AndersonFidelis O problema deve estar no muda ou no muda.mac. Tente fazer console.log(muda) e console.log(muda.mac) para ver o que tem nessas variáveis
    – hkotsubo
    4/12/2018 às 17:45

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .