html中input的学习

来源：互联网发布：mac如何更改启动项编辑：程序博客网时间：2024/06/15 19:16

学习input的使用

<!DOCTYPE html><html><head><title>input test</title><meta charset="utf-8"></head><body><form action="http://www.w3school.com.cn/demo/demo_form.asp" method="get">  <p>First name: <input type="text" name="first name" /></p>  <p>Last name: <input type="text" name="last name" /></p>  <input type="submit" value="Submit" /></form></script></body></html>

如果我们需要input中的输入框中有提示信息可以表单修改如下：

1、

HTML 5 <input> placeholder 属性

placeholder 属性适用于以下的 <input> 类型：text, search, url, telephone, email 以及 password。

如：

<!DOCTYPE html><html><head><title>input test</title><meta charset="utf-8"></head><body><form action="http://www.w3school.com.cn/demo/demo_form.asp" method="get">  <p>First name: <input type="text" name="first name" value="" placeholder="请输入英文fn" /></p>  <p>Last name: <input type="text" name="last name" value="" placeholder="请输入英文ln" /></p>  <input type="submit" value="Submit" /></form></script></body></html>

2、

使用js

<input type="text" name="first name"  value="" onfocus="this.value=''" onblur="if(this.value==''){this.value='请输入英文fn'}" />

可以写成如下：

<!DOCTYPE html><html><head><title>input test</title><meta charset="utf-8"></head><body><form action="http://www.w3school.com.cn/demo/demo_form.asp" method="get">  <p>First name: <input type="text" name="first name"  value="请输入英文fn" onfocus="javascript:this.value=''" onblur="javascript:if(this.value==''){this.value='请输入英文fn'}" />  </p>  <p>Last name: <input type="text" name="last name"  value="请输入英文ln" onfocus="javascript:this.value=''" onblur="javascript:if(this.value==''){this.value='请输入英文ln'}" /> </p>  <input type="submit" value="Submit" /></form></script></body></html>

阅读全文

0 0