怎么把提交按扭改为用图片来代替

应用背景:

	这段时间在做嵌入式web网站开发的过程中,需要把网页上的数据提交到cgi程序中,但是html不加以美化的提交表单按钮和界面格格不入,于是想到用图片来替换按键,以下是从博客上搜到的解决方法,也经过了本人的验证可行(我用的是第一种方法,比较简单),提交数据的时候还会把点击该图片相对坐标(x,y)的值也相应提交给cgi。原文转自:http://blog.csdn.net/hblxwaz/article/details/2052459。谢谢!
 


解决思路

 
 
   用type属性为image的按钮或者给图片添加提交表单的功能。 


具体步骤

 
 


方法一:用image类型的input控件。

 

<form name="demo" method="get" action="login.asp"> 
<input name="username" type="text"> 
<input name="password" type="password"> 
<input type="image" src="your_submit_button.gif" name="img"> 
</form> 



方法二:在图片上加上脚本控制的。


<form name="demo" method="get" action="login.asp"> 
<input name="username" type="text"> 
<input name="password" type="password"> 
</form> 
 <img src="your_submit_button.gif" onclick="demo.submit()"> 

注意:type=image类型的图片按钮,在单击后是提交表单的。 
技巧:可以把例中的your_submit_button.gif换成你自己的图片路径。 
 提示:用第二种方法时如果想在鼠标移上图片时变成手形,可以加上CSS设置cursor属性为hand。 
特别提示 
代码运行后,单击图片,表单将被提交。方法一的表单在提交后注意看一下地址栏,可以看到,单击图片控件时的X和Y坐标(相对于图片控件)也被提交了,并且前面加上图片控件名作前缀,如图1.4.8所示。 

图1.4.8 图片控件提交表单后的地址栏 

 
特别说明
本例问题的解决主要是利用type=image类型的按钮的特性和表单的submit方法。 
INPUT(type=image) 创建一个图像控件,控件被单击后将立即提交表单。控件支持的图片和视频格式有.avi、.bmp、.emf、.gif、.jpg、.mov、.mpg、.png、.wmf和.xbm。 
submit() 提交指定表单。

你可能感兴趣的:(怎么把提交按扭改为用图片来代替)