capturar el color de un div en js

fcosun · #1 (**permalink**) 11/05/2012, 14:28

la idea es pasar el color a javascript desde un color picker de jquery.

asigne el id del dv de tipo "color", pero en el alert no se refleja el valor, aparece como indefined.

Código Javascript:

Ver original<script>
function muestravalor()
{   
    var valor=document.getElementById("color").value;
    alert(valor);
}
    
</script>
 
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <link rel="stylesheet" href="css/colorpicker.css" type="text/css" />
    <link rel="stylesheet" media="screen" type="text/css" href="css/layout.css" />
    <title>ColorPicker</title>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/colorpicker.js"></script>
    <script type="text/javascript" src="js/eye.js"></script>
    <script type="text/javascript" src="js/utils.js"></script>
    <script type="text/javascript" src="js/layout.js?ver=1.0.2"></script>
</head>
<body>   
     
    <p>Optiene el colorpicker</p>
    <div id="customWidget">
        <div id="colorSelector2"><div id="color" style="background-color: #ff007b"></div></div>
        <div id="colorpickerHolder2">
        </div>
    </div>
 
   <input type="button" onclick="muestravalor()" value="hola">
</body>
</html>

IsaBelM · #2 (**permalink**) 11/05/2012, 15:30

cuanto daño hace jquery!!

un div no tiene la propiedad value como tal. para obtener su contenido tienes dos maneras. la mas común es innerHTML

IXtremeLT · #3 (**permalink**) 11/05/2012, 17:18

No concuerdo que jQuery hace daño mental como para confundirse con los usos nativos de javascript, simplemente hay que acostumbrarse y disfrutar las maravillas de esta biblioteca.

Cierto, un div no usa el atributo value para ver su contenido debe ser innerHTML, pero en este caso debes acceder al atributo "style" para ver el color.

Ponlo asi:

Código Javascript:

Ver originalvar valor=document.getElementById("color").style.backgroundColor;

O usando jQuery

Código Javascript:

Ver originalvar valor = $('#color').css('backgroundColor');

Saludos!