jQuery className 和 removeClass 不起作用答案

【问题标题】：jQuery className and removeClass not workingjQuery className 和 removeClass 不起作用
【发布时间】：2014-03-25 18:48:06
【问题描述】：

我在长函数中有以下条件：

if ( shipSet == true ) {
    $("#" + shippingFields[i]).style.background = 'gray';
    $("#" + shippingFields[i]).className = 'optional';      
} else {
    $("#" + shippingFields[i]).removeAttribute('style');
    $("#" + shippingFields[i]).removeClass('optional');
}

style 行工作正常，无论是真是假，但 className 和 removeClass 行不工作。有什么建议？我只是没有正确使用它们吗？

【问题讨论】：

$("#" + shippingFields[i]).style. 应该是 $("#" + shippingFields[i])[0].style.。您需要了解 DOM 元素和 jQuery 对象之间的区别。
className 是 DOM 元素的属性，而不是 jQuery 函数。您应该改用 jquery css 函数：$("#" + shippingFields[i]).css("background", "gray");
即使我使用document.getElementById(shippingFields[i]).className = 'optional'; 它仍然不起作用。还有@Satpal，THE STYLE LINES WORK FINE

标签： javascript jquery removeclass classname

【解决方案1】：

由于("#" + shippingFields[i]) 返回一个 jQuery 对象。

您需要改用addClass() 和removeClass()：

if ( shipSet == true ) {
    $("#" + shippingFields[i]).css('background','gray');
    $("#" + shippingFields[i]).addClass('optional');      
} else {
    $("#" + shippingFields[i]).removeAttr('style');
    $("#" + shippingFields[i]).removeClass('optional');
}

另外，您可以使用css() 设置元素的样式。

【讨论】：

很高兴它有帮助！快乐的编码伙伴:)

【解决方案2】：

试试这个，添加类名总是使用$("#attributeID").addClass('ClassName');

if ( shipSet == true ) {
    $("#" + shippingFields[i]).css('background','gray');
    $("#" + shippingFields[i]).addClass('optional');      
} else {
    $("#" + shippingFields[i]).removeAttr('style');
    $("#" + shippingFields[i]).removeClass('optional');
}

【讨论】：

【解决方案3】：

您应该使用addClass（向元素添加类）和removeClass（从元素中删除类）：

$("#" + shippingFields[i]).addClass('optional');      
$("#" + shippingFields[i]).removeClass('optional');

【讨论】：

【解决方案4】：

if ( shipSet == true ) {
    $("#" + shippingFields[i]).css('background','gray');
    $("#" + shippingFields[i]).addClass('optional');      
} else {
    $("#" + shippingFields[i]).removeAttr('style');
    $("#" + shippingFields[i]).removeClass('optional');
}

【讨论】：