HTML - 拼寫檢查屬性



HTML 的 **spellcheck 屬性** 指定瀏覽器是否應檢查可編輯元素中文字的拼寫。

在 HTML 中,包括文字輸入欄位和 contenteditable 元素在內的多個元素可以應用 **spellcheck** 全域性屬性。它調節瀏覽器自動拼寫檢查功能的行為,啟用或停用它,併為元素內的文字更正提供建議。

此屬性可以設定為 true 以啟用它,設定為 false 以關閉它,或者不指定以讓瀏覽器決定預設情況下該怎麼做。透過確保使用者生成的資訊正確編寫,從而提升使用者體驗。

語法

<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>

輸入元素的拼寫檢查

讓我們來看下面的例子,我們建立一個表單並在輸入欄位中啟用 spellcheck。如果拼寫不正確,它將用紅線進行下劃線。

<!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
spellcheck 9.0 10.0 2.0 5.1 10.5
html_attributes_reference.htm
廣告
© . All rights reserved.