在javascript中基于元素id删除并添加类

时间:2015-07-13 15:20:27

标签: javascript jquery html

当我选择两个按钮时,页面会重新加载,并且有两个值分配给变量。我试图设置它,所以当页面加载时它会删除一个类,并根据两个变量的值添加一个类。

我通过拉取从两个隐藏输入字段传递的值及其ID来获取变量

<input id="noType" name="noType" type="hidden" value="1" />
<input id="noAssign" name="noAssign" type="hidden" value="0" />

我在加载时获取它们的值。然后我有id type1 type2 type3的按钮,我添加并删除了类。

$(document).ready(function () {
    var type = document.getElementById("noType").value;
    var assign = document.getElementById("noAssign").value;
    $("type" + type).removeClass("btn-xxx")
           .addClass("btn-success");
    $("assigned" + assign).removeClass("btn-xxx")
           .addClass("btn-success");

});

我几乎100%确定我从隐藏的输入中抓取getElementById的正确ID并在尝试引用按钮的ID时正确使用它们。没有添加或删除类。我错过了什么?

这些是按钮

<button id="type1" class="btn-t btn-xxx type-button" 
onclick="SetType(1);"><i class="fa fa-info-circle fa-fw">
</i>Invitation</button><button id="type2" class="btn-t btn-xxx type-button" 
onclick="SetType(2);"><i class="fa fa-info-circle fa-fw">
</i>Assistance</button><button id="type3" class="btn-t btn-xxx type-button" 
onclick="SetType(3);">
<i class="fa fa-info-circle fa-fw">
</i>Finalize</button>

1 个答案:

答案 0 :(得分:2)

由于removeClass()addClass()是jQuery函数。

错误是正确的,因为document.getElementById("type" + type)返回DOM元素,并且它们没有上述方法。可以使用ID Selector (“#id”)

执行相同的操作
  

选择具有给定id属性的单个元素。

使用

$("#type" + type).removeClass("btn-xxx").addClass("btn-success");
$("#assigned" + assign).removeClass("btn-xxx").addClass("btn-success");