我可以从javascript中将字段标记为无效吗?

2022-08-30 04:43:44

通过阅读这篇文章,我发现HTML5引入了一些“有效”和“无效”输入值的伪类。

有没有办法从javascript中将输入字段标记为无效/有效?或者,我是否可以重写所使用的验证方法?


答案 1

您可以使用 customValidity 函数来实现此目的。

如果将自定义验证消息添加到字段,则该消息将变为无效。将消息设置为空字符串时,它将再次变为有效(除非由于其他原因而无效)。

field.setCustomValidity("Invalid field.");将使该字段无效。

field.setCustomValidity("");将使该字段有效,除非它未通过 HTML5 约束。


答案 2

编辑:有人澄清您正在为DOM寻找“有效”“无效”属性。

我会使用 为每个标签添加属性。您还可以有一个中央验证函数,该函数每次都会更新这些属性(并且每次都会使用)。dom_object.setAttribute("isvalid", "true")dom_object.getAttribute("isvalid")

您可以在元素每次失去焦点时或随时运行此函数。

不完全优雅,但不幸的是,现在javascript和HTML5没有“伪”支持。


如果我理解你的问题,你可以用Javascript进行验证。但是,请注意,绕过客户端验证非常容易,尤其是javascript验证。您永远不应该信任客户端数据,而应始终在服务器端进行检查。

例如,我可以通过检查源代码轻松找到元素ID,然后执行更改最大值(这是链接中的条目之一)。document.getElementById('some_id').setAttribute('max', new_number)

有多种方法可以做到这一点,所以我会试着给你一个通用的习语。

您可以通过执行来获取值(确保将表单 a 发送到服务器,以及 javascript 使用的表单)。对于文本区域,可以使用 。document.getElementById('form_element_id').valuenameid.innerHTML

然后你有一个变量中的值,有多种方法可以检查它。

例如,您可以执行 .你也可以使用正则表达式,我不会解释这一切,但你可以从这里开始 http://www.w3schools.com/jsref/jsref_obj_regexp.asp。我知道w3schools不是最好的来源,但我发现这是一个不错的起点。if (parseInt(my_value) < 0) //error

现在对于验证部分:添加到表单标记中,其中 validateForm() 是执行所有检查的函数。如果有效,则该函数仅返回。这将覆盖默认验证函数(默认情况下不执行任何操作)。onsubmit="return validateForm()truefalse

因此,在上面的示例中,将替换为 。你也可以做其他事情;例如,提醒错误然后返回假。您还可以使用javascript来突出显示无效字段(不确定这是否是您所说的“从javascript将输入字段标记为无效/有效”的意思。//errorreturn false")

当然,如果您不想检查所有字段,则只需在某些字段通过时返回true。同样,你不应该依赖这一点,但如果你只是为了阻止普通人,那么这是一个简单的解决方案。