分享
 
 
 

HTML初学者教程-表单

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

本站原创内容,转载请注明出处网页教学网。

使用表单可以实现把页面的传送数据,当用户在页面内填写好了信息之后可以单击提交按钮来实现数据的发送,当我们想和用户交互时可以使用表单来实现。比如本站的:http://webjx.com/yijian.htm

表单自己是没有用途的,他们通常都和一个程序来连接实现数据的处理,比如当你熟悉了制作静态网页的制作之后,你就该感觉到功能非常有限了,这时你就该想建动态的站了那时你就充分理解表单的用处了。在这里介绍一个最简单的使用方法,就是当你的主机只支持HTML时,你可以制作一个在线提交表单,然后表单的数据以Email的形式发送出去的方法。

表单标签通常有:form, input, textarea, select and option这几个。

用form标签定义表单的,它里面必须有action行为才能把表单的内容传送出去。通常在该标签里还有method属性来告诉浏览器数据传送出去的方法,通常有两种方法:get和post,默认的是post方法,也就是以邮寄方式把数据送出,而get通常是在服务器某个地址得到数据。

表单的代码通常是下面的格式:

input标签通常用在表单中,他是表单中的一个重要的标签,他的具体的格式如下:

<input type="text" /> 是一种标准的格式.标明是文本类型的数据信息。

<input type="password" /> 也是一种标准格式, 但是它通常显示的是星号来代替了我们实际输入的内容。用做制作密码的页。

<input type="checkbox" /> 是一个副选框, 用来询问访问这是否选择这一项。他也有自己的一个已经被选择的属性,格式为:<input type="checkbox" checked="checked" />。

<input type="radio" /> 是一个单选框,通常设置几个这样的标签之后,只允许用户选择其中的一个。

<input type="file" /> 显示计算机中的文件的一个区域,通常是你打开的一个文件或程序.

<input type="submit" />是一个按钮,当你添好了表单的内容可以用它来实现提交,也可以控制显示在按钮上的文本,例如:<input type="submit" value="webjx.com" />.

<input type="image" /> 按钮上显示的是一个图形.它需要我们用 src 来指明图象的位置。

<input type="button" /> 是一个按钮,当没有其他的代码时,他什么作用也没有。

<input type="reset" /> 重置表单的按钮。可以把刚刚填写的内容全部清除掉。

<input type="hidden" />是一个不被显示并且用来传递数据的一个域,像是页使用者是的名字比如可以标明你这封邮件是来自webjx.com这的,那么当我打开邮箱查看时就会显示邮件是来自webjx.com的我就知道是通过我的网站提交来的数据。呵呵

textarea 是一个基本的并且当输入的内容比较多时来使用的一个标签。他需要行和列属性:

<textarea rows="5" cols="20">A big load of text here</textarea> 在这个标签里面通常有option标签。例如:

当表单被发送出去时我们挑选的选项的值将会被送出。

类似 副选钮和单选钮一样,option 也有select属性例如:<option value="mouse" selected="selected">Rodent</option>。

上面讲的所有的标签都在我们和程序连接时都要给他们起一个名字才能和程序连接上了。 举例来说 <input type="text" name="talkingsponge" />

表单在使用中的完整的代码如下图。(注意:这种表单要是正常工作应该有一个 'contactus.php' 文件来处理表单的内容的,否则表单的数据不能正确处理的,或者我们在这里把这个文件改为:mailto:webmaster@webjx.com来实现提交邮件,其他方式就没有了)

你可以通过学习本站的一些高级的内容来实现编程处理表单了!那时你就是高手了。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有