语义UI，使用JavaScript更改类

我的输入代码如下：

<div class="ui form">
<div id="wlsdom" class="ui icon input">
<input type="text" id="wlsname" name="wlsname" placeholder="WLS domain...">
<i class="disk outline icon"></i>
</div>
</div>  

<button onclick="validation();" class="ui  green button"><i class="eye icon">
</i>Show URL</button>

---

所以基本上我要做的是表单验证。如果字段为空，我想将输入元素的类从默认状态更改为错误状态。但不知何故，这个脚本不起作用。还是我用错了。请帮帮我。谢谢

您可以使用

element.classList+=“myClass”

添加类

const wlsdom=document.getElementById（'wlsdom'）；
函数验证（）{
如果（！wlsdom.value | | wlsdom.value==“”）{
警报（“请输入域名”）；
wlsdom.classList+=“错误”；
}否则{
wlsdom.classList-=“错误”；
}
}

显示URL

---

似乎您丢失了一个“}”。

您可以仅使用

错误类，而不是所有类。如果else语句不为空，请添加else语句以删除错误类


函数验证（）{
if（document.getElementById（'wlsname'）。值=“”）{
警报（“请输入域名”）；
document.getElementById（'wlsdom'）.classList.add（'error'）；
}
否则{
document.getElementById（'wlsdom'）.classList.remove（'error'）；
}
}
。错误{
边框：1px纯红；
}

Show URL
函数的
classList.add（）
参数中不能包含空格。如果要一次添加多个类，请使用
，
符号将它们分开。在您的情况下，只需使用：

document.getElementById('wlsdom').classList.add('error');

并删除此行：

document.getElementById('wlsdom').classList.remove('ui icon input');

请参阅关于classList.add（）函数
也许您应该使用
document.getElementById（'wlsdom'）.classList.toggle（“error”）
而不是
document.getElementById（'wlsdom'）.classList.remove（'ui图标输入'）；document.getElementById（'wlsdom'）.classList.add（'ui图标输入错误'）谢谢这帮了我的忙..！！：）
document.getElementById('wlsdom').classList.add('error');

document.getElementById('wlsdom').classList.remove('ui icon input');