Various input with the same name

-1

I want to put several input with the same name, but as soon as I try it, only the first works. What I want is to change a text color infinitely, and I have that, but it only works in the first input, as I said before. I wanted to know if it can be done in some way because I am a beginner and I was excited. And if it's not too much trouble, I'd like to not have to use CSS, php or something like that, but I admit it (I prefer it to be without css or php but if it's the only way I do not care).

This is the text I want to fix:

<html>
    <head>
        <script> 
            var coloresIntermedios = ['#FF0000','#FF1000'];
            var color = 0;

            function otroColor() { 
                document.forms[0].cdc.style.color = coloresIntermedios[color++ % coloresIntermedios.length]; 
            } 
        </script> 

        <title>Ejemplo</title> 
    </head> 
    <body background="C:\Users\Public\Paginas WEB.jpg" onload="setInterval('otroColor()', 100)"> 
        <center> 
            <p>
                <form>
                    <input id="tc" disabled type="submit" type="text" name="cdc" value="Colores 1" />
                </form> 
            <p>
                <form>
                    <input id="tc" disabled type="submit" type="text" name="cdc" value="Colores 2" />
                </form>
        </center>
    </body>
</html>
    
asked by Qwerty 19.10.2017 в 17:44
source

1 answer

1

Reviewing your code I see that you were very close to achieving your goal, your mistake was that you were always selecting the form[0] bone you were always selecting the first form ignoring the second, so all you have to do is go all existing form , also fix several errors that you had in terms of opening and closing tags.

var coloresIntermedios = ['#FF0000','#333333'];

function otroColor() { 
    for(var i = 0; i < document.forms.length; i++){
        document.forms[i].cdc.style.color = coloresIntermedios[i];
    }
} 
<body onload="setInterval('otroColor()', 100)">
<center>
    <p>
        <form>
            <input id="tc" disabled type="submit" name="cdc" value="Colores 1" />
        </form> 
    </p>

    <p>
        <form>
            <input id="tc" disabled type="submit" name="cdc" value="Colores 2" />
        </form> 
    </p>
</center>
</body>
    
answered by 19.10.2017 / 18:10
source