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

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

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

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

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

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

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

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

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

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

  1. $.ajax({
  2. type: 'POST',
  3. url: url,
  4. data: data,
  5. success: success,
  6. dataType: dataType
  7. });

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. "errcode":40163,"errmsg":"code been used...报错,做PC微信登录时出现code been used...报错问题

    这是一个坑,一个巨坑,一个恶心的坑 出现这个问题的大概意思就是微信回调了两次登录接口,code使用了两次,而在微信官方文档上写着code只能用一次,用来获取access_token,但我TM看着就糊涂 ...

  2. 在ASP.NET程序中用程序动态向<head>便签里添加<meta>标签

    在使用ASP.NET框架开发: 若要在Html网页中加入<meta>设置,但想通过程序动态加入: 1.如果是ASP.NET4.0以前版本: 使用HtmlMeta类加入<meta> ...

  3. sed命令参数之-r -i

    对于初学linux的朋友来说,能记住命令附带的一大帮参数就以及非常不容易了.好不容易把该用的参数都想全了.sed -irns 后面一大片脚本 ,一执行出错了 what!!!! 创建一下测试环境 hea ...

  4. xx.hbm.xml中相关重要的配置

    1.<!-- 指定hibernate操作数据库时的隔离级别             #hibernate.connection.isolation 1|2|4|8                 ...

  5. 简单介绍一下在CentOS上安装Docker。

    简单介绍一下在CentOS上安装Docker. 前置条件: 64-bit 系统 kernel 3.10+ 1.检查内核版本,返回的值大于3.10即可. $ uname -r 2.使用 sudo 或 r ...

  6. JSON 解析 (二)—— Jackson的使用

    Jackson是基于Java语言的一种JSON和Java对象的数据处理工具.功能上简单易用,性能上根据目前主流转换工具比较,Jackson相对比较高效. <dependency> < ...

  7. 扫描某目录下的所有文件的MD5码并导出文件【可执行jar】

    pom <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http:// ...

  8. VSCode里面HTML添加CSS时没有提示

    看到知乎上的回答,vscode修改设置的: "editor.parameterHints": true, "editor.quickSuggestions": ...

  9. Django 下载和初识

    Django Django官网下载页面 安装(安装最新LTS版): pip3 install django==1.11.9 创建一个django项目: 下面的命令创建了一个名为"mysite ...

  10. Android学习第7天

    这次大都是广播案例,在笔记中不予展示注: a.做开机启动时,在广播类中用到Intent需要这三行代码 Intent intent1 = new Intent(context, MainActivity ...