Lógica da programação JQUERY

[TubaraoBR 0]

Olá, estou tendo problema com a mudança de atributo quando uso .change e seta variável.

Quando uso uma variavel pre determinada, funciona, quando uso via .change não funciona. Códigos abaixo:

 

Assim funciona:


var $cor = "000000";
$('area.manga').attr('data-maphilight','{"fillColor":"'+$cor+'" ,"fillOpacity":0.7}');
});

Assim funciona o alert também:

 $('#cores1').change(function () {
	var $value = $(this).val();
	alert($value);
});

E o que eu quero que funcione, teoricamente, seria assim:

 $('#cores1').change(function () {
	var $value = $(this).val();
	$('area.manga').attr('data-maphilight','{"fillColor":"'+$cor+'" ,"fillOpacity":0.7}');
});

Obrigado à quem puder ajudar.

[William Bruno 1501]

vc tem q colocar o # na frente da cor, para indicar que é em hexadecimal.

[TubaraoBR 0]

Obrigado pela ajuda Willian, mas nesse caso é sem # mesmo... Como citei acima, funciona com variavel fixa sem #.

Não é essa a solução.

Vou tentar explicar melhor.

 

O script abaixo funciona corretamente. Seta o fillcolor com a variavel $cor = "valor". Sem #

 

$(document).ready(function () {
var $value = "CC184E";

$('area.manga').attr('data-maphilight','{"fillColor":"'+$value+'"}');
 
});

O script abaixo, funciona corretamente também. Recebe um valor dinamico quando eu altero "change" o input e emite um alert com o valor da variavel corretamente:

 

$(document).ready(function () {

 $('#cores1').change(function () {
	var $value = $(this).val();
	alert($value);
    });
	
});

O que eu quero, é que seta o fillcolor com o valor da variavel quando eu alterar o input como emite o alert corretamente. Só que é para setar o fillcolor como no script com variavel fixa. Que eu achei que fosse assim:

 

$(document).ready(function () {
 $('#cores1').change(function () {
	var $value = $(this).val();
$('area.manga').attr('data-maphilight','{"fillColor":"'+$value+'"}');
    });
	
});

Obrigado.

[William Bruno 1501]

Ok, então vamos lá.

 

Quem é o plugin que manipula o atributo data-maphilight ?

É nele que vc deve fazer a alteração, inclusive do change. Pelo visto ele não "percebeu", que vc alterou o atributo, oque faz completo sentido, já que não existe listener para isso.

 

Quem é esse plugin/script ?

[TubaraoBR 0]

Acredito eu que seja o .maphilight()

Entendi um pouco do que você quis dizer, só acho estranho ainda, funcionar com variavel fixa e não funcionar com a variavel dinamica.

 

Obrigado

[William Bruno 1501]

O problema não é a variável é o evento.

 

O .maphilight(), não foi avisado que vc mudou o atributo.

[TubaraoBR 0]

Entendo, mas como ele é avisado quando usado uma variavel com valor fixo e não é avisado quando usa-se .change e seta uma variavel dinâmica???

 

E como fazer portanto.

 

Obrigado.

[William Bruno 1501]

Não conheço o plugin que vc usou, precisaria ver o código dele, estudar e ver como ele trabalha.

 

Ele foi avisando qndo vc fez sem o evento de change, pq provavelmente, vc o plugin está rodando depois de vc setar a variável, então é como se não houvesse nenhum js, mas sim tivesse escrito direto no html.

 

Eu te apontei o problema, não tenho obrigação de saber como resolver tudo. Entenda o que eu disse, estude e tente fazer.

[TubaraoBR 0]

ok. Obrigado.