Dúvida sobre Javascript (função chamada 2 vezes - onblur e onclick)

Front-end
#1

Olá pessoal,

Estou com um problema e gostaria de saber se alguém saberia me ajudar na resolução…

É o seguinte, tenho um campo de texto que quando clico nele (onFocus) ele apresenta logo abaixo do campo uma paleta de cores construída em html.
Até aí tudo bem.

Quando clico fora do campo de texto (onblur) ele deve esconder a paleta de cores e quando ele clicar em uma cor da paleta (onclick) ele deve colocar o valor da cor no campo e esconder a peleta de cores.

Para isso fiz uma função javascript quer é chamada tanto no onblur do campo quanto no onclick das cores na paleta de cores.

O problema é que, quando clico fora do campo de texto, ele chama a função e apaga a paleta corretamente mas, quando clico na cor, primeiro ele chama a função do onblur(já que ele clicou fora do campo) e depois chama de novo a mesma função pelo onclick da cor na paleta. O problema é que a paleta já foi escondida na primeira chamada do método e, portanto a cor não é setada.

Preciso que a função seja chamada primeiro no onclick e depois no unblur. Teria como fazer isso?

Vou colocar o código aqui para dar uma noção melhor do problema.

Código contendo o onblur

[code]

 
[/code]

Código da paleta de cores contendo o onclick:

[code]

function showColorPicker(name, field) {

previousColor = field.value;
colorField = field;
var html = ‘

’;
var color = ‘’;
var coresPorEscala = 0; 
while(coresPorEscala != 8){
	if(coresPorEscala == 0){
		color = '#000000'; 
	}else if(coresPorEscala == 1){
		color = '#8B4513'; 
	}else if(coresPorEscala == 2){
		color = '#8B5A00'; 
	}else if(coresPorEscala == 3){
		color = '#8B6914'; 
	}else if(coresPorEscala == 4){
		color = '#006400'; 
	}else if(coresPorEscala == 5){
		color = '#00008B'; 
	}else if(coresPorEscala == 6){
		color = '#8B0000'; 
	}else if(coresPorEscala == 7){
		color = '#B03060';  
	}
	coresPorEscala = coresPorEscala +1;
	html += '<td style="background-color: ' + color + ';" onClick="updateColorPicker(\'' + name + '\', \'' + color + '\', true);">&nbsp;</td>';
}
html += '</tr><tr>';
html += '</tr></table></div>';

    $('colorPicker_' + name).update(html);	
$('colorPicker_' + name).show();

}[/code]

Função de atualização da paleta.

function updateColorPicker(name, value, done) {
	
	if (value != previousColor) {
		if (done) {
			colorField.value = value;
		}
	
		updateGenericProperty(name, value);
		$('color_' + name).style.backgroundColor = value;
	}
	
	if (value != previousColor || done) {
		
		previousColor = null;
		colorField = null;
	}
	$('colorPicker_' + name).hide();
}

Bom, espero a ajuda de vocês.

Desde já agradeço.

#2