Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Gavaldão

Select não preenche cor do fundo no WIN 8.1 IE11

Por , em Javascript

Recommended Posts

Gavaldão    14

Gavaldão
Postado

Boa tarde Amigos.

Uso Windows 8.1

Gostaria de uma dica porque esse select, só funciona (preenche a cor do fundo) no Internet Explores 11 em modo de compatibilidade, e não funciona nos outros browsers.

Meu aplicativo roda no IE 11 normal e no Firefox sem problemas mas o select não preenche a cor do fundo, e preciso para que os usuarios

vejam a cor selecionada, mas não posso usar o modo de compatibilidade.

abaixo o exemplo:

 

index.php

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

</head>

<style type="text/css">

 

.c1{

background: #00F;

color:#FFF;

}

.c2{

background: #063;

color: #FFF;

}

.c3{

background: #6A3500;

color: #FFF;

}

.c4{

background: #F00;

color: #FFF;

}

.c5{

background: #60F;

color: #FFF;

}

 

</style>

<body>

 

<table>

<tr><td>Cores</td></tr>

<tr><td><select name="cores" onchange="sel();">

<option value=""></option>

<option value="c1" class="c1">cor1</option>

<option value="c2" class="c2">cor2</option>

<option value="c3" class="c3">cor3</option>

<option value="c4" class="c4">cor4</option>

<option value="c5" class="c5">cor5</option>

</select></td></tr></table>

 

</body>

</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Gavaldão    14

Gavaldão
Postado

Olá Rafael
Bem visto. Não existe essa função o código é assim.

<table>
<tr><td>Cores</td></tr>
<tr><td><select name="cores">
<option value=""></option>
<option value="c1" class="c1">cor1</option>
<option value="c2" class="c2">cor2</option>
<option value="c3" class="c3">cor3</option>
<option value="c4" class="c4">cor4</option>
<option value="c5" class="c5">cor5</option>
</select></td></tr></table>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rafael Sirotheau    43

Rafael Sirotheau
Postado

Se for só isso, não vai funcionar em lugar nenhum mesmo, já que a mudança do select não está sendo observada em lugar nenhum.

Poste o seu javascript para esta página.

 

 

Edit: O que deveria mudar a cor mas não está mudando? O fundo do option?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Gavaldão    14

Gavaldão
Postado

O exemplo é parte de meu código.

 

Bem após seletado, o campo fica com fundo na cor selecionada e o nome da cor preenchido

 

 

ex: selecionei cor1 = fundo do campo azul e preenchido cor1.

O valor "cores" é gravado em uma tabela do cadastro de eventos, onde ao selecionar um evento

ele aparece com a cor que foi selecionada em um campo.

 

Esse script assim funciona em meu localhost se usar o Windows 7 com IE9

ao preenche a cor, nos outros browsers.

NO Windows 8 só preenche cor se o IE11 estiver em modo de compatibilidade.


Bem Rafael é o seguinte.

Se vc. colocar esse script no localhost, vai ver que funciona.
Eu desenvolvi um programa de controle para cooperativa com
um módulo (financeiro cadastro etc.)
Trabalhei usando o Firefox, e esse modulo funciona perfeito todas as funções no Firefox e no Internet Explorer. e não funciona em modo de compatibilidade.
O segundo módulo Adaptei um calendário agenda para o sistema de escalas, em que esse select e mais três funções só roda perfeito no Internet Explorer em modo de compatibilidade.

O usuário tem de utilizar os dois módulos simultâneos, e não há como ficar mudando de modo de compatibilidade ou usar dois browsers. por isso estou tentando ver o funcionamento desse select
as funções que só funcionam em compatibilidade no Internet Explorer e não roda no Firefox. para que seja um conjunto.

 

Funções que não estão funcionando também:

São chamadas no <imput ........ onblur="calculaPactaxa()"> e <input.....onblur="SomaPlan()">

function calculaPactaxa(){
var preço = parseFloat(document.getElementById("valreal").value.replace(".","").replace(",","."));
var quantos = parseFloat(document.getElementById("admtaxa").value.replace(",","."));
var num = preço * quantos/100;
x = 0;
if(num<0) {
num = Math.abs(num);
x = 1;
}
if(isNaN(num)) num = "0";
cents = Math.floor((num*100+0.1)%100);
num = Math.floor((num*100+0.1)/100).toString();
if(cents < 10) cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+'.'
+num.substring(num.length-(4*i+3));
ret = num + ',' + cents;
if (x == 1) ret = ' - ' + ret;
document.getElementById("valtaxa").value = ret;

}

function Somaplan(){
var preço = parseFloat(document.getElementById("valreal").value.replace(".","").replace(",","."));
var quantos = parseFloat(document.getElementById("valtaxa").value.replace(".","").replace(",","."));
var num = preço - quantos;
x = 0;
if(num<0) {
num = Math.abs(num);
x = 1;
}
if(isNaN(num)) num = "0";
cents = Math.floor((num*100+0.5)%100);
num = Math.floor((num*100+0.5)/100).toString();
if(cents < 10) cents = "0" + cents;
for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
num = num.substring(0,num.length-(4*i+3))+'.'
+num.substring(num.length-(4*i+3));
ret = num + ',' + cents;
if (x == 1) ret = ' - ' + ret;
document.getElementById("valplan").value = ret;

}

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rafael Sirotheau    43

Rafael Sirotheau
Postado

Entendi... O problema é que alterar estilo de <select> e <option> não é nenhum pouco confiável e pode apresentar problemas entre navegadores. A apresentação desses campos varia entre navegadores/OS, então, não é recomendado confiar na estilização deles.

Posso te dar duas soluções melhores para isto:

1- Que você apresente a cor selecionada em outro lugar, para garantir a compatibilidade em outros navegadores. ex.: http://jsfiddle.net/ztj8pdme/

2- Utilizar alguma biblioteca (ou fazer manualmente) para estilização de select. Algumas opções: Select2 e Chosen.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Gavaldão    14

Gavaldão
Postado

OLá Rafael, estava viajando.

Bem testei suas sugestões mas não funcionou como eu queria (preencher o fundo) realmente é a diferença entre os Browsers e a versão do Windows.

Acabei optan do por usar o colorselect.js que funcionou.

Agradeço a ajuda.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito