form提交
方法一:利用form的onsubmit()函数(经常使用)
- <script type="text/javascript">
- function validateForm(){
- if(document.reply.title.value == ""){ //通过form名来获取form
- alert("please input the title!");
- document.reply.title.focus();
- return false;
- }
- if(document.forms[0].cont.value == ""){ //通过forms数组获取form
- alert("please input the content!");
- document.reply.cont.focus();
- return false;
- }
- return true;
- }
- <form name="reply" method="post" onsubmit="return validateForm( );">
- <input type="text" name="title" size="80" /><br />
- <textarea name="cont" cols="80" rows="12"></textarea><br />
- <input type="submit" value="提交" >
- </form>
- 注意:
- 1.onsubmit属性内容一定要有return关键字,否则函数会直接执行,不会返回
- 2.validateForm一定要返回一个boolean类型的返回值
- 3.提交按钮要写成submit类型的
方法二:利用input类型为submit组件的onclick()函数
1.将上面form标签中的onsubmit="return validateForm()"属性,去掉。
2.为“提交”按钮添加onclick事件,如下:
<input type="submit" value="提交" onclick="return validateForm();">
方法三:利用button组件的onclick()函数,手动提交
- <script type="text/javascript">
- function modifyItem() {
- if (trim(document.getElementById("itemName").value) == "") {
- alert("物料名称不能为空!");
- document.getElementById("itemName").focus();
- return;
- }
- with (document.getElementById("itemForm")) {
- method = "post";
- action = "item.do?command=modify&pageNo=${itemForm.pageNo}";
- submit();
- }
- }
- //返回
- function goBack() {
- window.self.location = "item.do?command=list&pageNo=${itemForm.pageNo}";
- }
- </script>
- <form name="itemForm" id="itemForm">
- <input name="itemNo" type="text" id="itemNo" value="${ item.itemNo }" >
- <input name="itemName" type="text" id="itemName" value="${ item.itemName }" >
- <input name="btnModify" type="button" id="btnModify" value=“修改" onclick="modifyItem()">
- </form>
- 注意:
- 1.提交时,设置form的action和methods属性,然后利用form.submit()函数提交。
总结:
1.对form中的组件验证时,前两个使用的是name属性,包括form自身的。
2.如果提交表单时没有反应,同时确定提交表单部分代码没有问题,请查看提交表单前面的js代码,有时前面js的错误会引发莫名其妙的问题。
form提交的更多相关文章
- 关于button和form提交的一些问题
1.form 中type 为submit 和button的区别 submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理( ...
- 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象
之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...
- AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)
一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...
- struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)
我的前台页是这样的: <body> <form action="test.action" method="post"> ...
- jquery.form.js实现将form提交转为ajax方式提交的使用方法
本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完 ...
- jquery.validate+jquery.form提交的三种方式
原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...
- Extjs ajax form 提交
1.form 提交 form.form.submit({ url: "/HandlerExcelToDB/UploadFile.ashx", params: {}, success ...
- 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据
jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...
- HttpWebRequest结合HtmlAgilityPack实现网页form提交
年前一个项目,需要在某个系统实现系统自动操作. 系统页面使用form提交,页面参数较多,也参数设计一系列计算逻辑,改动一个值,其他值自动改变. 传统方法使用正则表达式匹配参数,构建post参数进行请求 ...
- spring MVC做form提交Neither BindingResult nor plain target object for bean name 'command' available
这两天在做spring3.0 MVC+hibernate3.2的练习中,做简单的form提交, 一直报java.lang.IllegalStateException: Neither BindingR ...
随机推荐
- 解决vue-cli相对路径问题 about css assert path ,two Solution(css路径的问题解决方案) #179
https://github.com/vuejs/vue-cli/issues/179
- 昂达v981平板刷机教程连接
http://tieba.baidu.com/p/3721193574 http://www.ondabbs.cn/forum.php?mod=viewthread&tid=65393 htt ...
- 【模板】文艺平衡树(Splay) 区间翻转 BZOJ 3223
您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作:翻转一个区间,例如原有序序列是5 4 3 2 1,翻转区间是[2,4]的话,结果是5 2 3 4 1 N,M<= ...
- springmvc htmlEscape标签的作用
有些东西自己不知道就想要弄明白 唉 做项目 看人家项目中用到啦 不会 不知道 就百度啦 整理了一下 方便自己记忆 一.SpringMVC 表单元素标签 如下: <form:textarea ...
- Gym - 101572D Distinctive Character bfs 思维
题目传送门 题目大意: 给出n个01串,让你构造一个字符串,使这个字符串和这些字符串中相似程度最高 尽可能低.如果两个字符串对应位置相同,则相似程度加一. 思路: 每一个01串更改自己的一部分后,都可 ...
- windows logstash配置
E:\logstash-6.2.4\bin目录下新建logstash.conf input { stdin { } } output { stdout { codec=> rubydebug } ...
- python模块之wordcloud
wordcloud官方文档: http://amueller.github.io/word_cloud/generated/wordcloud.WordCloud.html#wordcloud.Wor ...
- windows环境搭建禅道项目管理工具
zentao官网的几个网址 http://www.zentao.net/ http://www.zentao.net/article-view-79863.html 搭建环境需要下载两个文件 1) ...
- Mybatis学习笔记8 - resultMap自定义结果集映射规则
一.resultMap自定义结果集映射规则 示例如下: 接口定义: package com.mybatis.dao; import com.mybatis.bean.Employee; public ...
- Linux 系统 文件锁 fcntl函数详解
#include <unistd.h> #include <fcntl.h> int fcntl(int fd, int cmd); int fcntl(int fd, int ...