方式一: 使用input type="submit" 提交

<form action="http://www.w3school.com.cn/tiy/loadtext.asp" onsubmit="return false;">
<input type="text" name="userName" />
<input type="submit" />
</form>

onsubmit 事件会在表单中的确认按钮被点击时发生。  return false会阻止提交;

方式二:使用js提交 submit()方法

<form action="http://www.w3school.com.cn/tiy/loadtext.asp" id="myForm">
<input type="text" name="userName"/>
<input type="button" onclick="submitForm();" />
</form>
function submitForm() {
document.getElementById("myForm").submit();
}

方式三: 使用jquery提交 submit()方法

<form action="http://www.w3school.com.cn/tiy/loadtext.asp" name="testForm">
<input type="text" name="userName" />
<input type="submit" />
</form>
$("form[name=testForm]").submit(function(e) {
// 阻止默认提交
//e.preventDefault();
// 或者
//return false;
});

使用 e.preventDefault(); 或者 return false; 可以阻止默认提交

方式四: 使用ajax提交(或者jquery封装的ajax 推荐)

参考地址:http://www.w3school.com.cn/jquery/ajax_post.asp

$.ajax({
type: 'POST',
url: url,
data: data,
success: success,
dataType: dataType
});

js 表单提交的更多相关文章

  1. 原生JS 表单提交验证器

    转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言 最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定 不用外部 ...

  2. js表单提交,面向对象

    一.js表单验证之后再提交 1.普通按钮onclick函数调用表单的submit()函数 <input type=button name="submit1" value=&q ...

  3. js表单提交,判断文本框,用户名密码是否为空,JS表单检测!

    当表单提交时先触发验证的js代码,当验证表单的方法返回true时才会提交表单返回false则不提交数据<script type="text/javascript">fu ...

  4. 代码段:js表单提交检测

    市面上当然有很多成型的框架,比如jquery的validation插件各种吧.现在工作地,由于前端童鞋也没用这些个插件.根据业务的要求,自己就在代码里写了个简单的表单提交的检测代码(php的也写了一个 ...

  5. JS表单提交的几种方式

    第一种方式 : 表单提交,在 form 标签中增加 onsubmit 事件来判断表单是否提交成功 <script type="text/javascript"> fun ...

  6. js表单提交回调函数

    在研究表单的时候发现一个有意思的东西——在表单提交的时候如何保证数据全部提交完毕才会清空? 我们常用的<input type="reset" value="重置&q ...

  7. js表单提交一种方式

    在一个html和php混编的文件中,用到js提交表单的方法: 定义表单id为form1,提交按钮type为submit, var data_info = document.getElementById ...

  8. html js 表单提交前检测数据

    通过使用form的onsibmit来控制是否提交数据 返回值为真是提交,其他不变,示例如下: JS部分 function check() { var newPwd = document.getElem ...

  9. js表单提交到后台对象接收

    $.extend({ StandardPost:function(url,args){ var form = $("<form method='post' target='_blank ...

随机推荐

  1. dentry path_lookat dput

    https://www.ibm.com/developerworks/cn/linux/l-cn-usagecounter/index.html https://blog.csdn.net/young ...

  2. WPF实现Windows资源管理器(附源码)

      今天我来写一篇关于利用WPF来实现Windows的资源管理器功能,当然只是局部实现这个功能,因为在很多时候我们需要来实现对本机资源的管理,当然我们可以使用OpenFileDialog dialog ...

  3. 对C#调用C++的dll的一点思考

    最近在对接C++程序的时候碰到了一些问题,然后花了一段时间才解决,今天就这些小问题来做一个总结,很多时候由于对另外一种开发语言的不熟悉,会在使用的过程中遇到很多的问题,这些问题看似简单但是背后却有很多 ...

  4. 一、Dev

    一.获取选中的表格 // MessageBox.Show(gridview_Parent.GetFocusedDataRow()["series"].ToString());//获 ...

  5. EChart.js 笔记一

    一直对数据可视化比较感兴趣,当年 Alibaba 年报晚会上的大屏显示可谓是技惊四座,够震撼,将数据之美展现得淋漓尽致. 国内的前端数据可视化插件中,echart.js 算是热度很高的,也容易上手,算 ...

  6. react用构造函数创建组件

    有两种方法,一种是通过构造函数创建,一种是通过class创建 1.构造函数创建组件 用function+组件名的方式创建,创建好了,在render里面以标签的形式一丢就可以啦!但是这种方式必须要ret ...

  7. codeforces509B

    Painting Pebbles CodeForces - 509B There are n piles of pebbles on the table, the i-th pile contains ...

  8. wpgwhpg

    //f[i][j]就是第is时wpgwhpg的疲劳度是j,那么我们就可以就ta这1s是否休息进行讨论 #include<bits/stdc++.h> using namespace std ...

  9. [UOJ86]mx的组合数——NTT+数位DP+原根与指标+卢卡斯定理

    题目链接: [UOJ86]mx的组合数 题目大意:给出四个数$p,n,l,r$,对于$\forall 0\le a\le p-1$,求$l\le x\le r,C_{x}^{n}\%p=a$的$x$的 ...

  10. 轮询、长轮询、websock

    引入 Web端即时通讯技术:即时通讯技术简单的说就是实现这样一种功能:服务器端可以即时地将数据的更新或变化反应到客户端,例如消息即时推送等功能都是通过这种技术实现的.但是在Web中,由于浏览器的限制, ...