触发form表单的两种提交方式,submit和button的用法
1.当输入用户名和密码为空的时候,需要判断。这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写;有两种方法,一种是用submit提交。一种是用button提交。
方法一:
在jsp的前端页面的头部插入一个js方法:
function checkUser(){
var result = document.getElementById("userid").value;
var password = document.getElementById("userpassid").value;
if(result == "" ){
alert("用户名不能为空");
return false;
}
if(password == "" ){
alert("密码不能为空");
return false;
}else{
return true;
}
}
在form表单里写成这样:
<form id="formid" name= "myform" method = 'post' action = 'user_login_submit.action' onsubmit = "return checkUser();" >
<table width="100%" border="0">
<tr>
<td width="60" height="40" align="right">用户名 </td>
<td><input type="text" value="" class="text2" name = "username" id = "userid"/></td>
</tr>
<tr>
<td width="60" height="40" align="right">密 码 </td>
<td><input type="password" value="" class="text2" name = "userpass" id = "userpassid"/></td>
</tr>
<tr>
<td width="60" height="40" align="right"> </td>
<td><div class="c4">
<input type="submit" value="" class="btn2" />
方法二:
所有主流浏览器都支持 <button> 标签。
定义和用法
<button> 标签定义一个按钮。
在 button 元素内部,您可以放置内容,比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。
<button> 控件 与 <input type="button"> 相比,提供了更为强大的功能和更丰富的内容。<button> 与 </button> 标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或多媒体内容。例如,我们可以在按钮中包括一个图像和相关的文本,用它们在按钮中创建一个吸引人的标记图像。
唯一禁止使用的元素是图像映射,因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。
请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"。
重要事项:如果在 HTML 表单中使用 button 元素,不同的浏览器会提交不同的值。Internet Explorer 将提交 <button> 与 <button/> 之间的文本,而其他浏览器将提交 value 属性的内容。请在 HTML 表单中使用 input 元素来创建按钮。
function checkUser(){
var result = document.getElementById(“userid”).value;
var password = document.getElementById(“passid”).value;
if(result == “” ){
alert(“用户名不能为空”);
return false;
}
if(password == “” ){
alert(“密码不能为空”);
return false;
}
document.getElementById(“formid”).submit();
}
form表格的写法,需要写id
<form id="formid" method = 'post' action = 'user_login_submit.action' >
button按钮的写法如下:
<input type="button" value="" class="btn2" onclick = "checkUser();" />
触发form表单的两种提交方式,submit和button的用法的更多相关文章
- form表单的两种提交方式,submit和button的用法
1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...
- 【转载】form表单的两种提交方式,submit和button的用法
1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...
- Form表单的几种提交方式
<script type="text/javascript"> $(function() { //1.ajax提交 $("#ajaxBtn").cl ...
- ASP.NET MVC 表单的几种提交方式
下面是总结一下在ASP.NET MVC中表单的几种提交方式. 1.Ajax提交表单 需要引用 <script type="text/javascript" src=" ...
- 使用js提交form表单的两种方法
提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...
- Django 构建模板form表单的两种方法
通常情况下,我们想构建一张表单时会在模板文件login.html中写入 <form action="/your-name/" method="post"& ...
- html的两种提交按钮submit和button
转自:http://baiying.blog.51cto.com/1068039/1319784 html按钮有两种: <input type="button" value= ...
- form表单两种提交方式的不同
我们在使用<Form>表单的时候,最常用的提交方式就是Get和Post.我们都知道这两种方式最大的差别就是安全性,除此之外,它们还有哪些其他的区别,你知道吗? 在<Form& ...
- form表单中get和post两种提交方式的区别
一.form表单中get和post两种提交方式的区别? 1.get提交表单中的内容在链接处是可见的.post不可见 2.post相比于get是安全的 3.post不收限制大小,get有限制大小(黑马视 ...
随机推荐
- AIM Tech Round 5 (rated, Div. 1 + Div. 2) (A, B, E)
B.Unnatural Conditions 题目链接 : http://codeforces.com/contest/1028/problem/B #include<iostream> ...
- 模块cv2的用法
一.读入图像 使用函数cv2.imread(filepath,flags)读入一副图片 filepath:要读入图片的完整路径 flags:读入图片的标志 cv2.IMREAD_COLOR:默认参数 ...
- python & mysql 操作(compare_sum_fee)
[1]源码 工作中涉及的python工具源码实现 费用比较工具源码: #!/usr/bin/python3 #coding = utf-8 import time, sqlite3, datetime ...
- flask实战-留言板-Web程序开发流程
Web程序开发流程 在实际的开发中,一个Web程序的开发过程要设计多个角色,比如客户(提出需求).项目经理(决定需求的实现方式).开发者(实现需求)等,在这里我们假设自己是一个人全职开发.一般来说一个 ...
- python-布尔表达式
1.布尔类型(bool): 1.只有两种情况 真/假 (True / False) 2. print(type(False)) # <class 'bool'> type() ...
- post请求中body数据类型
1.application/json:json格式,如下: {"input1":"xxx","input2":"ooo" ...
- springboot整合redis(简单整理)
Redis安装与开启 我这里是在windows上练习,所以这里的安装是指在windows上的安装,操作非常简单,点击https://github.com/MicrosoftArchive/redis/ ...
- Js重拾
如果重新声明 JavaScript 变量,该变量的值不会丢失: 在以下两条语句执行后,变量 carname 的值依然是 "Volvo": var carname="Vol ...
- C++环境设置
g++ -V #include <iostream> int main() { std::cout << "Hello World!\n"; return ...
- JavaScript实现自定义日期时间
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...