HTML - spellcheck 属性



HTML spellcheck 属性指定浏览器是否应检查可编辑元素中文本的拼写。

在 HTML 中,可以将多个元素(包括文本输入字段和 contenteditable 元素)应用于 spellcheck 全局属性。它调节浏览器的自动拼写检查功能的行为,启用或禁用它,并为元素内的文本更正提供建议。

可以设置此属性 true 以启用它,设置为 false 以将其关闭,或者设置为 unspecified 以让浏览器决定默认情况下要执行的操作。通过确保用户生成的信息被正确编写,它可以提高用户体验。

语法  


<tag contenteditable spellcheck="true | false">

适用于

由于spellcheck 属性是 HTML 中的全局属性,因此所有可以包含文本的标签都支持 spellcheck 属性。

HTML spellcheck 属性的示例

以下示例将说明 HTML spellcheck 属性,我们应该在何处以及如何使用此属性!

段落元素的拼写检查

在以下示例中,我们将创建一个 HTML 文档,并使用 spellcheck 属性来确定是否可以检查该元素是否存在拼写错误。


<!DOCTYPE html>
<html>
<head>
		<style>
		p {
				padding: 2px;
		}
		</style>
</head>
<body>
	 <h3>HTML spellcheck Attribute</h3>
	 <strong>Spellcheck is active</strong>
	 <p contenteditable spellcheck="true">
			This exampull will be checked fur spellung 
			when you try to edit it.
	 </p>
	 <strong>Spellcheck is deactivate</strong>
	 <p contenteditable spellcheck="false">
			This exampull will nut be checked fur spellung
			when you try to edit it.
	 </p>
</body>
</html>

输入元素的拼写检查

让我们看一下以下示例,在该示例中,我们创建一个表单并在输入字段中启用拼写检查。如果拼写错误,它将通过红线下划线。


<!DOCTYPE html>
<html>

<body>
	 <h3>HTML spellcheck Attribute</h3>
	 <form>
			<p>
			<input type="text" spellcheck="true"
						 placeholder="Enter your name">
			</p>
			<p>
			<input type="email" spellcheck="true" 
						 placeholder="Enter your email">
			</p>
			<p>
			<textarea spellcheck="true" 
								placeholder="comments">
			</textarea>
			</p>
			<button type="reset">Reset</button>
	 </form>
</body>

</html>

支持的浏览器

浏览器 Chrome Edge Firefox Safari Opera
是否支持 9.0 10.0 2.0 5.1 10.5