0

因此，我正在尝试使用 javascript 更改输入框的类，但似乎无法正确处理。

我有 2 个 CSS 类。

普通类是 .butz ，我希望按钮在单击时更改为 .butzz

所以，我的 html 有这个：

<input id="butval1" class="butz" type="button" name="design1" value="Choose Design" onclick="" />

这是我的 js

document.getElementById("butval1").className += "butzz";

我真正想做的是将类从 butz 更改为 butzz 或...如果可能的话，使用 getElementByClassName 更改按钮的背景颜色

我有 9 个按钮都在同一个类中，我希望单击的一个按钮变为绿色或 #24f000

谢谢你们

4

2 回答 2

2

使用javascript您可以使用更改类名

document.getElementById('butval1').className = 'butzz'

如果你想通过 javascript 添加一个新类，请使用

document.getElementById('butval1').className += ' butzz'

要更改单击的 DOM 类，您需要创建函数并将单击的 DOM 作为参数传递给函数，并使用传递的 args 来执行此操作。

例子

<input id="butval1" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />
<input id="butval2" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />
<input id="butval3" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />

function changeID(args)
{
    args.className = 'butzz'
}

现场演示

于 2013-09-11T04:02:43.923 回答
1

尝试：

<input id="butval1" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />
<input id="butval2" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />
<input id="butval3" class="butz" type="button" name="design1" value="Choose Design" onclick="changeID(this);" />

function changeID(elm){
    var NAME = elm;
    var currentClass = NAME.className;
    if (currentClass == "butz") { 
        NAME.className = "butzz";   
    } else {
        NAME.className = "butz";  
    }
}

DEMO FIDDLE

于 2013-09-11T04:03:19.487 回答