html之input标签

来源:互联网 发布:网站论坛源码 编辑:程序博客网 时间:2024/05/13 21:12
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />


<title>html之input标签</title>


<script type="text/javascript">
  function msg()
  {
  var fname=document.getElementById("fname");
var password=document.getElementById("password");
  alert("账号:" + fname.value +"\n" + "密码:" + password.value);
  }
</script>


</head>


<body>
<form action="http://www.w3school.com.cn/example/html/form_action.asp" method="get" autocomplete="on">


<h2> type="text" </h2>
  <p>账号: <input type="text" name="fname"  id= "fname" value="goal" size="35" /></p><br/>


<h2> type="password" </h2>
  <p>密码:<input type="password" name="password" id="password" value="1234" maxlength="6" size="15" autocomplete="off" /></p><br/>
  
<h2> type="button" </h2> 
   <input type="button" value="Click me" onclick="msg()"/>
   <p>如果点击上面的按钮,会启动一段 JavaScript。如果您希望学习更多有关 JavaScript 的知识,请访问我们的 JavaScript 教程。</p><br/>  
     
<h2> type="hidden" </h2>
  <p>隐藏选项:<input type="hidden" name="country" value="China" /></p>
  
<h2> type="reset" </h2> 
  <input type="reset" value="重写" />
<h2> type="submit" </h2> 
  <input type="submit" value="确认" />
  
</form>


<p>请单击确认按钮,输入会发送到服务器上名为 "form_action.asp" 的页面。</p><br/>


<form action="http://www.w3school.com.cn/example/html/form_action.asp" method="get">
<p>禁止使用: <input type="text" name="lname" disabled="disabled" /></p>
<p>只读:<input type="text" name="read" value="只读" readonly="readonly" /></p>
<h2> type="checkbox" </h2> 
<input type="checkbox" name="vehicle" value="Bike" checked="checked" /> I have a bike<br />
<input type="checkbox" name="vehicle" value="Car" /> I have a car<br />
<input type="checkbox" name="vehicle" value="Airplane" /> I have an airplane<br />
<h2> type="radio" </h2> 
<input type="radio" name="sex" value="man" /> 男人<br />
<input type="radio" name="sex" value="feman" /> 女人<br />
<h2> type="image" </h2> 
 <input type="image" src="图片素材/箭头图标.jpg" alt="提交" width="10%" height="120px" />
<h2> type="file" </h2> 
 <input type="file" name="pic" accept="image/*" />
 <p><b>注释:</b>出于安全方面的考虑,本例不允许用户上传文件。</p>
</form>


<p>请在这幅图像上单击,输入会发送到服务器上名为 "form_action.asp" 的页面。</p> <br />


<p>注释:如果 type 属性设置为 image,当用户单击图像时,浏览器将以像素为单位,将鼠标相对于图像边界的偏移量发送到服务器,其中包括从图像左边界开始的水平偏移量,以及从图像上边界开始的垂直偏移量。</p>












</body>
</html>
0 0