submit和button提交表单的区别

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>submit</title>
<script type="text/javascript">
function checkForm(){
    if(document.form1.userName.value.length==0){
        alert("请输入用户名!");
        return false;
    }
    return true;
    document.form1.submit();
}
</script>
</head>
<body>
<form name="form1"  method="post" action="ygdacx.html" onsubmit="return checkForm()">
    <input type="text" name="userName" size="10" />
    <input type="submit" value="提 交" />
</form>
</body>
</html>

当类型为submit的input提交form表单时,配合onsubmit写事件。

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<title>button</title>
<script type="text/javascript">
function checkForm(){
    if(document.form1.userName.value.length==0){
        alert("请输入用户名!");
        return false;
    }
    document.form1.action="/email.php"
    document.form1.submit();
}
</script>
</head>
<body>
<form name="form1" method="post">
<button type="button" value="提 交"  onclick="checkForm()"></button>
</form>
</body>

使用button的话是先走一个onclick事件,在事件末端指向要跳转的php页面即可。

时间: 2024-10-21 02:46:07

submit和button提交表单的区别的相关文章

在javascript中关于submit和button提交表单区别

原文:在javascript中关于submit和button提交表单区别 原文来自:http://www.jb51.net/article/42236.htm submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上. 1. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成button,即取消其自动提交的

(转)在javascript中关于submit和button提交表单区别

原文来自:http://www.jb51.net/article/42236.htm submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上. 1. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成button,即取消其自动提交的行为, 否则,将会造成提交两次的效果,对于动态网页来说,也就是对数据库操作

jquery通过submit()和serialize()提交表单

<script type="text/javascript"> $(function() { $('#form1').submit(function() { //当提交表单时,会发生 submit 事件. //此处可做表单验证 //... ... var postData = $("#form1").serialize();//序列化表单,后台可正常通过post方法获取数据 $.ajax({ type: "POST", url: &q

JavaScript使用button提交表单

<form action="test.html" method="POST"> <input type="button" value="提交"/> </form> <!-- 用提交表单,重要 --> <script type="text/javascript"> //定位提交按钮 var inputElement = document.getEle

button提交表单 a标签提交表单

<form name="searchForm" id="searchForm" method="get" action="/ProductType?pageIndex=1"> <input type="text" value="" name="name" id="name" placeholder="Enter text

jquery中使用$(#form).submit()提交表单无效原因分析及解决Script

今天写了一个表单验证,验证的时候没有任何问题,但是页面提交不了,很诡异,然后各种百度,查了一下的原因是input的id不能为submit 注意:提交表单的时候,input的id不能为submit <dl> <dd> <label>角色名称:</label> <input type="text" id="role_name" name="name" style="text-indent

表单提交(三)——阻止Eneter键提交表单

当用户在文本框中进行编辑时,按下键盘Enter键,会触发表单提交.为了防止这种意外,有一种方法就是拒绝所有表单提交, 然后通过单击指定的提交命令按钮才能提交表单. 首先,将"return false"绑定到表单的onsubmit事件,来阻止所有表单提交. 第二,使用input="button"通过onclick事件,以this.form.submit()方法提交,而不会触发onsubmit事件. 所以不能使用jquery方式$("#myForm"

Ajax提交表单时验证码自动验证 php后端验证码检测

本文通过源码展示如何实现表单提交前,验证码先检测正确性,不正确则不提交表单,更新验证码. 1.前端代码 index.html <!DOCTYPE html> <html> <head> <title>验证码提交自验证</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta htt

form表单submit提交内容,跟ajax异步提交form表单的区别,

因为开发一个小细节,本来是上传文件,填写文件名进行ajax提交,但是没有获取到文件的绝对地址, 所以使用了form表单提交文件,然后又觉得form表单+ajax提交联系起来比较好,不用改动太多代码. 区别: Form表单提交:一般都会进行页面跳转: Ajax异步提交:可以不进行页面跳转: Form表单提交 <body> <div id="forms”> <form id="form1" action="/users/login"