from表单提交的不同方式

最新推荐文章于 2022-08-15 14:11:51 发布
最新推荐文章于 2022-08-15 14:11:51 发布
阅读量313 收藏
点赞数
<html>


<head>
<meta charset="UTF-8" />
<title></title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>


</head>


<body>
<form id="myform" name="myform" method="post" οnsubmit="return sumbitTest();" action="RegisterAction.action">
<table>
<tr>
<td>姓名:</td>
<td> <input type="text" name="name" /> </td>
</tr>
<tr>
<td>性别:</td>
<td>
<input type="radio" name="sex" value="1"> 男
<input type="radio" name="sex" value="0"> 女
</td>
</tr>
<tr>
<td>年龄:</td>
<td>
<select name="age">
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
</select>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="Submit普通提交">
<input type="button" id="ajaxBtn" value="AJAX提交" />
<input type="button" id="jqueryBtn" value="jQuery提交" />
<input type="button" id="jsBtn" value="JS提交" />
<input type="submit" value="onSubmit提交" />
</td>
</tr>
</table>
</form>
</body>


<script type="text/javascript">
$(function() {
//ajax提交  
$("#ajaxBtn").click(function() {
var params = $("#myform").serialize();
$.ajax({
type: "POST",
url: "RegisterAction.action",
data: params,
success: function(msg) {
alert("success: " + msg);
}
});
})


//jQuery提交  
$("#jqueryBtn").click(function() {
$("#myform").submit();
})


//js提交   
$("#jsBtn").click(function() {
document.myform.action = "RegisterAction.action";
document.myform.submit();
})
})


function sumbitTest() {
return true; //return false则不会提交   
}
</script>


</html>
MAYAO1206
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
表单设计以及优化Tips的总结
Wendy
10-18 4657
无论是注册流程、多页问卷，还是简单的数据录入界面，表单都是数字化产品设计的重要组成部分。我们无时无刻都在使用表单（Form），在网上购物、邮件注册、参与评论等等。不夸张的说，它已经成为了数字信息时代不可分割的一份子。然而，这么多年伴随着一些改进我们发现，表单设计在我们的使用感受中也仅仅停留在“还可以”的程度。不过，现在我们可以使用新的方法设计出更好、更便捷的表单体验。 那么，首先来说明一下表单所
html用户输入用户交互之Form表单——label进行表单优化
angrynouse的博客
03-21 197
<form> <!-- label中的for的名字=input中的id的名字 --> <label for="username">用户名</label> <input type="text" name="shuru" id="username"> <!-- 点一下用户名这三个字，输入框内即可有闪烁的光标，优化了鼠标客户体验--> </form> .
form的两种提交方式
g_blue_wind的博客
06-03 580
有两种方法，一种是用submit提交。一种是用button提交。 方法一： js方法： function tijiao(){    var result = document.getElementById("userid").value;    var password = document.getElementById("userpassid").value;    if(res
表单<form></form>提交方式的区别
chuluxie3918的博客
08-31 475
本文转载于:猿2048网站表单 提交方式的区别 <form action="" method="get/post"> 表单<form></form>的提交方式有两种：post，get post 方式 指交互信息 放入到请求体里面 get 方式 ...
From表单的jquery方式提交
不以人人的意志为转义乃天道
05-11 1500
 jquery表单提交方法submit（）特别注意2014-07-28 19:18 1654人阅读 评论(0) 收藏 举报 分类： Jquery/javascript（35）  版权声明：本文为博主原创文章，未经博主允许不得转载。先看如下jQuery代码：[javascript] view plain copy print?function goPage(page){          $('#p...
from表单提交和JSON区别
斜阳雨陌
05-22 2万+
form表单是“键值对”的数据格式，例如： a=1&amp;b=2&amp;c=3 而json格式则与之不同，如下： {"a":1,"b":2,"c":3} 传递的数据比较简单，那么两种方式基本上没什么大区别（当然后台接收数据的方式肯定是不同的），但是如果数据比较复杂，比如包含数组、对象等时，就只有json才能胜任了。此外，如果数据是通过表单提交的，那么当然使用默认的form即可，因为它会自动构建...
from 表单提交返回值用post或者是get方法实现
09-05
总结来说，`$.post` 和 `$.get` 是 jQuery 中用于实现异步表单提交和接收服务器返回值的方法，它们提供了灵活的方式来处理用户与服务器之间的交互，使得用户体验更加流畅。在实际应用中，应根据具体需求选择合适的...
from表单多个按钮提交用onclick跳转不同action
09-04
标题中的“from表单多个按钮提交用onclick跳转不同action”就是解决这个问题的一种方法。下面将详细讲解这个过程。 首先，来看一下给定的代码片段： ```html !list.action"> <!-- 下面input框提交的action不同，...
ajax提交整个from表单示例代码
10-25
主要介绍了ajax提交整个from表单实现代码,需要的朋友可以参考下
C# post方式提交Form表单
01-15
以下是一个简单的C# POST表单提交示例： ```csharp using System; using System.Net.Http; using System.Threading.Tasks; class Program { static async Task Main(string[] args) { var client = new ...
【微信小程序】之from表单
梦和远方的博客
04-25 1156
平常H5里面或者只要是个页面都会有表单，小程序也不例外 from表单 from.wxml <form bindsubmit='FormSubmit' bindreset='FormReset'> <view> <input name='title' placeholder='标题' value='{{value}}'></input&g...
Form表单提交数据的几种方式
Amelian的博客
06-24 3万+
1. submit提交 在form标签中添加Action（提交的地址）和method（post），且有一个submit按钮（<input stype=“submit”>)，通过点击这个按钮提交表单数据 -type=”submit“是将表单提交(即form.submit()方法)作为其onclick后的默认事件 type=”submit“会自动将所具有的name属性html输入的元素（包括input、button、select等标签都作为键值对提交） type=”submit“submit会有一
uni-app微信小程序——商城（5）——购物车
徐小硕—心之所向，素履以往
08-12 3586
基于Vue语法，使用uni-app框架来实现微信小程序中的购物车功能。 实现购物车的全选，多选，计算总价，删除商品等功能。 结合使用VantWeapp微信小程序前端框架来搭建购物车页面。 效果图如下： 效果视频如下： 微信小程序购物车录屏 百度云视频，链接：https://pan.baidu.com/s/1QQHIIT58woini-ggPmrzIA 提取码：xzs8 其中单个的商品可以使用左滑进行删除，视频没有体现出来，但是功能还是齐全的。 下面是代码部门： <temp..
form表单提交的几种方式
热门推荐
a1194821568的博客
06-04 17万+
表单提交方式一：直接利用form表单提交 html页面代码： <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Insert title here</title> </head> <body> <form action="h...
Form表单, 4种常见的表单提交方式
Aplumage的专栏
08-15 1万+
Form表单、四种常见的POST请求提交数据方式、MIME
Form表单method属性的两种提交方式Get和Post的区别
Java开发，人工智能，边缘计算，致力于掌握前沿技术
06-16 1万+
Mothod属性是控制表单的提交方式的。 表单提交方式有两种：post方式的提交，get方式提交（默认的方式）。 两者的区别： 1.get方式的提交，表单元素对应的值会以?key=value&key=value的方式显示在地址栏里面。Post方式不会。Post要相对安全一些。 2.因为get方式要把数据显示在地址栏里面，所以他可以传递的数据量是有限制的。Post的大小是没有限制的。 3....
表单提交的方式及区别
all_outD的博客
10-15 3114
这里简要的说明一下js中表单提交的方式和区别 提交的方式分为get、post两种方式 区别： 1）携带的参数 get:将参数以?的形式拼接再浏览器的地址栏上 post:将参数放到请求体中去 2）安全性 post比get更安全 如果以get方式请求登录接口时，用户输入的用户名等信息就会被 显示在浏览器的地址栏上，可以被其他用户查看 3）携带数据的大小 get携带数据的大小有限，一般比较小，最多传输1024字节的数据 post理论上没有大小的限制 ...
form表单的各种提交方式
qq_39772439的博客
06-03 6313
form表单提交方法很多。直接提交啊，或者js提交啊。 第一种提交方式：form表单直接提交 <form action="formDate" method="post"> userName:<input type="text" name="name"> passWord:<input type="password" name="passW...
elementui 上传图片和 from 表单提交方式
最新发布
09-28
在提交表单时，你可以使用elementUI提供的el-form组件来处理表单的提交方式。 代码示例： ```html 姓名"> <el-input v-model="form.name"></el-input> 年龄"> <el-input v-model.number="form.age"></el-...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值