Javascript 当两个输入都有值时，如何向元素添加类

当带有class

search\u box\u name

和

search\u box\u id

的两个输入都有任何值时，我想将一个活动类添加到元素

go\u back\u right

。我试着引用这个平台上已经存在的答案，但我没有运气，因为我是js新手。有什么帮助吗

。返回\u右侧：活动{
背景色：rgba（255,0,0,0.05）；
动画：状态4s向前；
}

函数setClass（）{
if（document.querySelector（“.search\u-box\u-name”）.value！=”&document.querySelector（“.search\u-box\u-id”）.value！=“”）{
document.querySelector（“.go_back_right”）.setActive（）；
}否则{
document.querySelector（“.go\u back\u right”）.setActive（false）；
}
}
setClass（）
。返回\u右侧：活动{
背景色：rgba（255,0,0,0.05）；
动画：状态4s向前；
}
下面是jQuery代码片段，用于设置添加/删除类的事件

$（文档）.ready（函数（）{
setEvents（）；
$（'.search_box_container'）。触发器（'change'）；
});
函数setEvents（）{
$（'.search\u box\u container'）。在（'change'，函数（）上{
变量$this=$（this），
search_-box_-name=$this.find（'.search_-box_-name'）.val（）.trim（），
search_-box_-id=$this.find（'.search_-box_-id'）.val（）.trim（）；
如果（搜索框名称和搜索框id）{
$（'.go_back_right'）.addClass（'active'）；
}否则{
$（'.go_back_right'）.removeClass（'active'）；
}
});
}
我想您想用class
向元素添加一个额外的类。返回\u right
对吗？如果是，请将其添加到JS文件：


const searchBoxName=document.getElementByClassName（'search_-box_-name'）；
const searchBoxId=document.getElementByClassName（'search_box_id'）；
const goBackRight=document.getElementByClassName（'.go_back_right'）；
常量addClass=（）=>{
if（searchBoxName&&searchBoxName.value&&searchBoxId&&searchBoxId.value）{
goBackRight.classList.add（'active'）；
}
}
addClass（）
不是一个类。您可能只需要
.active
和
$（“.go\u back\u right”）.addClass（“active”）
@freedomn-m检查其中是否有值的条件如何？哦。。。谢谢它现在可以工作了。@m4n0试试看你的css
：active
与class
.active
不匹配。您的代码片段提供了
未捕获的TypeError:无法读取null的属性“setAttribute”。但是，我希望在输入值后立即显示更改。无需单击屏幕上的某个位置。我已更改了
onchange
on
oninput
它可以工作，但是，我必须单击屏幕上的某个位置才能工作。一旦两个输入都获得值，有什么方法可以使其工作？@DenisKviatkovskij将
.on（'change'）
事件更新为
。on（'keyup'）
，并将
触发器（'change'）
更新为
触发器（'keyup'）
。它马上就可以工作了，工作得很好！非常感谢。