Como alterar o valor do atributo src de acordo com uma entrada de dados?

[groutmoustache]

 Tenho esse projeto, onde usuários de um jogo inserem vossos nicknames e aparece uma miniatura de seus avatares. Não fiz nada além de modificar o "src=''" de uma tag "img", para o link do servidor oficial, onde contém a foto do avatar, correspondente.

Resumindo:

 

insere nick -> onclick: muda src do img -> img recebe imagem do avatar de um usuário

 

O problema é que quando o nick não existe, o servidor não mostra nenhum imagem, obviamente. Quando isso acontece eu tenho o retorno desse ícone: 

 

O projeto prevê que o usuário vá colocar nicknames errados, por isso, mesmo que a foto do avatar não exista no servidor, o site deve mostrar uma outra imagem, que não esse ícone, acima.

Agora, se estão acompanhando meu raciocínio, eu queria saber como detectar que a imagem não existe e mudar o src.

[DiF]

@Joao_Lucaas Entendi perfeitamente mas não é assim que funciona a coisa,

 

POrque o alt não é usado para links, definitivamente não.

Para isso você usa o javascript.  atribui o src  um valor diferente caso não esteja certo.

 

Veja um exemplo: https://jsfiddle.net/3bLgjbx8/

 

Para testar coloque "dif " no campo e clique em verficar.. depois coloque outro nome de usuário e clique de novo em verificar.

Com isso.. você pode combinar o uso do ajax com o php.. e fazer uma verificação em um banco de dados.. onde caso exista o nick, ele atribui o src do nick caso não exista.. ele atribui um src padrão 

 

 

[groutmoustache]

@dif

Pior que acabei descobrindo um método menos braçal, antes mesmo de postares

.

Fiquei procurando palavras-chaves, para o Google mostrar algo relacionado e, descobri o evento "onerror=".

Tudo que eu tenho que fazer é acionar uma função, que muda a source da img, quando der erro.

 

Como fica a tag:

<img src="http://servidor-oficial.com/nome-avatar-inexistente.png" onerror="mudaSrc(this)">

Como fica o JS:

function mudaSrc(e) {
    e.src = "aviso-em-imagem.png";
}

 

Apesar de seu método não me apetecer, agradeço e peço desculpa por não ter pesquisado mais, e ter consumido teu tempo. OBRIGADO!

[DiF]

@Joao_Lucaas Pode ser, mas pelo que eu pesquisei vi que ela é reconhecida pelos principais navegadores só.

Isso quer dizer que se a pessoa não estiver usando um desses 5 (chrome, ie, firefox, safari e opera), pode não funcionar.

 

Melhor garantir a funcionalidade para qualquer navegador que suporte javascript com a solução que apresentei..