HTML input 文本框添加提示文字的方法

周未休息,感覺沒啥可寫的,就水一篇文章吧,說一說前端 html 頁面中 input 元素中在沒有值的情況下,添加提示的文字,當要輸入文字的時候,提示的文字消失。

關於 html input 輸入框的提示文字,有兩種方法可以實現,一種為 input 元素的 placeholder 屬性,一種為 js 方法。

input 元素的 placeholder 屬性

placeholder:屬性提供可描述輸入字段預期值的提示信息

語法:


例:input 添加提示的文字

代碼:


運行結果:

當input輸入框,輸出文字時,提示的文字信息會消失

HTML input 文本框添加提示文字的方法

js 方法添加 input 元素提示文字

示例代碼:


運行結果:

HTML input 文本框添加提示文字的方法

注:

1、js 方法添加的提示文字不同於 使用 placeholder 屬性添加的效果

2、placeholder 屬性添加的提示文字,只有輸入內容時文字才會消失

3、js 方式添加的提示文字,當光標定位到 input 輸入框中時,提示文字就會消失


分享到:


相關文章: