javascript - Color-changing Button -
I am creating a 3-color button that switches between red, green and blue colors when you press it . I think the error is in this
if (color.style.backgroundColor == 'ff0000';) {color.style.backgroundColor = '00ff00'; } If (color.style.backgroundColor == '00ff00';) {color.style.backgroundColor = '0000ff'; } If (color.style.backgroundColor == '0000ff';) {color.style.backgroundColor = 'ff0000'; }
Code, but I do not know what the specific problem is.
& lt; Html & gt; & Lt; Top & gt; & Lt; Title & gt; Button & lt; / Title & gt; & Lt; Script type = "text / javascript" & gt; Function buttonpress () {alerts ("hi"); } Function color () {if (color.style.backgroundColor == 'ff0000';) {color.style.backgroundColor = '00ff00'; } If (color.style.backgroundColor == '00ff00';) {color.style.backgroundColor = '0000ff'; } If (color.style.backgroundColor == '0000ff';) {color.style.backgroundColor = 'ff0000'; }} & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Button onclick = "buttonpress ()" & gt; Click me & lt; / Button & gt; & Lt; P & gt; & Lt; / P & gt; & Lt; Button ID = "Color" onclick = "colors ()" & gt; Hi & lt; / Button & gt; & Lt; Script & gt; Color.style.backgroundColor = 'ff0000'; & Lt; / Script & gt; & Lt; / Body & gt; & Lt; / Html & gt; You are missing a script tag
& lt; Html & gt; & Lt; Top & gt; & Lt; Title & gt; Button & lt; / Title & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Button id = "color 1" & gt; Hi & lt; / Button & gt; & Lt; Button id = "color 2" & gt; Hi & lt; / Button & gt; & Lt; Button id = "color 3" & gt; Hi & lt; / Button & gt; & Lt; Button ID = "Color4" & gt; Hi & lt; / Button & gt; & Lt; Button ID = "Color5" & gt; Hi & lt; / Button & gt; & Lt; Script type = "text / javascript" & gt; Function BgColorChanger (elem) {this.nextColor = function () {++ index; If (index == colors lamps) index = 0; Elem.style.backgroundColor = colors [index]; } Elem.onclick = function () {changer.nextColor (); } Var Changer = this; Var Color = ['FF0000', '00FFFX ',' 0000FF ']; Var Index = -1; This.nextColor (); } New BgColorChanger (document.getElementById ("color1")); New BgColorChanger (document.getElementById ("color2")); New BgColorChanger (document.getElementById ("color3"); New BgColorChanger (document.getElementById ("color4"); New BgColorChanger (document.getElementById ("color5"); & Lt; / Script & gt; & Lt; / Body & gt; & Lt; / Html & gt;
Using the code above, you can now change the unlimited elements without writing more code. In addition to this, if you put BgColorChanger in the context of the example, external code bgColorChangerInstance.nextColor ();
Comments
Post a Comment