如何更改js中的按钮颜色?

时间:2017-03-30 02:01:02

标签: javascript

这是我在html中单击按钮时调用的代码我不知道为什么按钮不会变黑/白实际上它在我将我的PHP代码放入我的html文件之前工作得很好警告用&#34 ; ASDF"只是检查我的代码是否正在执行

功能检查(事件){

var x=event.currentTarget;
var button_type=document.getElementsByTagName("button");   

for(var i=0;i<button_type.length;i++)
    {
        if(button_type[i].id==x.id){
    //  alert(button_type[i].id);
            var index=i;
        }

     }
        var start=0;
        var end=button_type.length;

        for(var q=start;q<=end;q++)
            {
                if(q==index)
                    {       alert("asdf");
                            button_type[q].style.filter="grayscale(0)";
                            button_type[q].style.padding="3cm";
                    }

            else{
                            button_type[q].style.filter="grayscale(100%)";
                            button_type[q].style.padding="";

                }
            }
    }

这是我的按钮在html中声明的方式

    <button  id ="love" type="button" ><img src="love.png"  alt="notfound"  width="30" height="30"/></button>

    <button  id ="haha" type="button" ><img src="haha.png"  alt="notfound"  width="30" height="30"/>  </button>
    <button  id ="wow"  type="button" ><img src="wow.jpg"  alt="notfound"  width="30" height="30"/>  </button>
    <button  id ="Angry"type="button" ><img src="angry.png"  alt="notfound"  width="30" height="30"/> </button>
    <button  id ="sad"  type="button" ><img src="sad.png"   alt="notfound" width="30" height="30"/>    </button>






     and this is how I called the js function
var x=document.getElementsByTagName("button");
for(var v=0;v<x.length;v++)
    {
         x[v].addEventListener("click",checkp,false);
      }

1 个答案:

答案 0 :(得分:0)

你能分享一下html吗?

每个按钮的ID是否从0开始并递增1?

如果没有,那么此行有一个错误,如id =&#34;&#34;而不是数字。

LINE 6: if(button_type[i].id==x.id){

您希望使用此代码实现什么目标?如果你告诉我们你想要它用什么html做什么,那么我绝对可以帮助你!