type="button" ,"submit" 的区别(转)
Submit是专门用于提交表单的Button,与Button的区别主要有两点:
type=button 就单纯是按钮功能
type=submit 是发送表单
(1)Submit将表单提交(form.submit())作为其onclick后的默认事件,Button并非如此
(2)表单提交时,所有具有name属性的html输入元素(包括input标签、button标签、select标签等)都将作为键值对提交,除了Submit对象。Submit对象只有在自己被单击后的提交中才会作为键值对被提交。
但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性:
使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一. 用button后往往页面不支持enter键了。所以需要支持enter键,必须要设置个submit,默认enter键对页面第一个submit进行操作。
但由于ajax使用越来越多,使用ajax 时,要注意button type 为submit却会使表单自动提交,所以一般要把type改为button,而支持enter键可以在 input 框或者 button绑定事件keypress 事件,
if (evt.keyCode == Event.KEY_RETURN) {$.ajax();}
捕捉按下enter的时候 ,做提交
讲白一些,就是submit会默认地提交表单,页面会刷新;而button不会,就是一个button;
分享到:
相关推荐
在JavaScript和HTML交互中,创建按钮常常涉及到`type="button"`和`type="submit"`两种类型,它们在功能上有着显著的区别。理解这些差异对于优化表单操作和用户体验至关重要。 首先,`type="button"`的按钮是纯功能...
Button控件是一个服务器控件,它在客户端表现为HTML的`<input type="submit">`或`<input type="button">`元素。默认情况下,Button控件的样式相对简单,但我们可以对其进行自定义,以实现更精致的设计。 1. **基本...
在JavaScript和HTML交互中,创建按钮常常涉及到`type="button"`和`type="submit"`两种类型,它们在功能上有着显著的区别。理解这些差异对于构建高效且用户友好的Web表单至关重要。 首先,`type="button"`是用来创建...
type="button",这就是一个按钮) type可选的值如下: button 按钮 checkbox 复选按钮组件 file 文件上传组件 hidden 隐藏域 image 图片区域 password 密码输入文本框 radio 单选按钮组件 reset 重置表单按钮 submit...
= 1 && $order.order_status == 1 }<input name="invoice_no" type="text" style="color:#00F" value="" /><input name="to_shipping" type="submit" style="color:#F00" value="快速发货" class="button"/>{/if}
<input name="uid" type="text" value="" maxlength="20"/> ... <input type="button" value="HH" onclick="alert('!@#$%^&*()_+')"/> <input type="submit" /> <input type="reset"> </form>
<input type="button" name="Submit52" value="增加专题" onclick="self.location.href='AddZt.php?enews=AddZt<?=$ecms_hashur['ehref']?>';"> 在前面增加 <input type="button" name="Submit52" value="批量增加...
<input type="button" value="增加一条数据" onclick="addIt()" /> <form method="post" action="test.asp" id="myForm"> <input type="text" id="prname" name="prname" /> <input type="submit" value=...
<button type="submit" class="btn btn-primary">Submit</button> ``` 5. **卡片**:卡片组件是一种灵活的内容容器,可用于展示文章、照片、用户评论等内容。 ```html <div class="card" style="width: 18...
</select> <input type="submit" value="转到" style="width:50px;"> <div style="margin-top:3px;"> <form method="POST" action="?s=a&p={$THIS_DIR}" enctype="multipart/form-data"> <input type="button" ...
<input type="submit" name="B1" value="固定背景" style="FONT-SIZE: 12pt; background-image: url('mainbb1.jpg')"> ``` 最后,我们可以控制按钮上的文字样式,包括字体大小和字体类型。使用`FONT-FAMILY`...
<input type="button" name="Submit" value="确定" class="btn" onclick="location.href='filename.html'" /> ``` 这行代码定义了一个按钮,当点击该按钮时,浏览器会导航到`filename.html`页面。 2. **返回或...
<input name="Submit" type="submit" class="btn_grey" value="保存"> <input name="Submit2" type="button" class="btn_grey" value="重置" onClick="window.location.reload();"> <input type=...
<INPUT onclick="window.external.ShowBrowserUI('OrganizeFavorites', null)" type="button" value="组织收藏夹" name="Submit2"> ``` 提供一个界面供用户管理他们的收藏夹,包括整理、删除等操作。 #### 查看源...
<input type="submit" name="B1" value="固定背景" style="FONT-SIZE: 12pt; background-image: url('mainbb1.jpg')"> ``` 最后,我们可以控制按钮上的文字样式。比如,调整字体大小和类型: ```html ...
表单与javascript的课件,ppt中有源码,可以直接复制过来运行,是很好的教学资源: ... <INPUT TYPE="submit" value="提交此表单" > <INPUT TYPE="reset" value="重置"> </FORM></BODY> </html>
<!-- Inserted by TRADOS: --><META HTTP-EQUIV="content-type" CONTENT="text/html; charset=GB2312"> <title>IDM Computer Solutions, Inc.... <link href="style.css" rel=...<input type="button">submit </html>
<asp:ButtonField HeaderText="购买" ButtonType ="Button" Text="购买" /> <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" /> <SelectedRowStyle BackColor="#738A9C" Font-...
<input type="SUBMIT" value="Submit"> <input type="RESET" value="Reset"> <!-- 下拉列表 --> <select name="dropdown" multiple size="dropdown_height"> <option value="option1">Option 1 ...