HTML - Marcar impares

 
Vista:
sin imagen de perfil
Val: 5
Ha aumentado su posición en 18 puestos en HTML (en relación al último mes)
Gráfica de HTML

Marcar impares

Publicado por Jean (4 intervenciones) el 01/09/2021 10:23:25
Hola, alguien sabria porque este codigo falla, en teoria deberia marcar los impares, eso si lo hace pero luego deberia descarlos todos cuando vuelves a presionar el boton y no lo hace por algun motivo
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
<!DOCTYPE HTML>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script type="text/javascript">
 
        function pulsar(){
            if($("li:odd").css('background-color', '#FFFFFF')){
                $("li:odd").css('background-color', '#FF0000');
                $("#boton1").html('Ocultar resultado');
            }else{
                $("li:odd").css('background-color', '#FFFFFF');
                $("#boton1").html('Ver resultado');
            }
 
        }
        </script>
        <style>
            li
            {
 
                height:  30px;
                width:  30px;
            }
        </style>
    </head>
    <body>
        <ul>
        <li>0</li>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        </ul>
        <button id="boton1" onclick="pulsar();  ">Ver resultado</button>
    </body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil

Marcar impares

Publicado por Horroroso (1 intervención) el 01/09/2021 15:47:42
Hola, buen día.

No funciona porque estas comparando el color, con una asignacion.
Es decir,
1
f($("li:odd").css('background-color', '#FFFFFF')){
es true siempre.

te recomiendo que hagas lo siguiente:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!DOCTYPE html>
 
<!DOCTYPE HTML>
 
<html>
 
    <head>
 
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 
        <script type="text/javascript">
 
         function pulsar() {
 
            if ($("ul").data('colored') == false) {
 
                $("li:odd").css('background-color', '#FF0000');
 
                $("#boton1").html('Ocultar resultado');
 
                $("ul").data('colored', true);
            } else {
 
                $("li:odd").css('background-color', '#FFFFFF');
 
                $("#boton1").html('Ver resultado');
 
                $("ul").data('colored', false);
 
            }
 
 
 
        }
 
    </script>
        <style>
 
            li
 
            {
 
 
 
                height:  30px;
 
                width:  30px;
 
            }
 
        </style>
 
    </head>
 
    <body>
 
       <ul data-colored="false">
 
        <li>0</li>
 
        <li>1</li>
 
        <li>2</li>
 
        <li>3</li>
 
        <li>4</li>
 
        <li>5</li>
 
        <li>6</li>
 
        </ul>
 
        <button id="boton1" onclick="pulsar();  ">Ver resultado</button>
 
    </body>
 
</html>

Saludos!

-Horroroso-

PD. No olvides calificar!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar