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">用户名&nbsp;</td>
<td><input type="text" value="" class="text2" name = "username" id = "userid"/></td>
</tr>
<tr>
<td width="60" height="40" align="right">密&nbsp;&nbsp;码&nbsp;</td>
<td><input type="password" value="" class="text2" name = "userpass" id = "userpassid"/></td>
</tr>
<tr>
<td width="60" height="40" align="right">&nbsp;</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的用法的更多相关文章

  1. form表单的两种提交方式,submit和button的用法

    1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...

  2. 【转载】form表单的两种提交方式,submit和button的用法

    1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...

  3. Form表单的几种提交方式

    <script type="text/javascript"> $(function() { //1.ajax提交 $("#ajaxBtn").cl ...

  4. ASP.NET MVC 表单的几种提交方式

    下面是总结一下在ASP.NET MVC中表单的几种提交方式. 1.Ajax提交表单 需要引用 <script type="text/javascript" src=" ...

  5. 使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

  6. Django 构建模板form表单的两种方法

    通常情况下,我们想构建一张表单时会在模板文件login.html中写入 <form action="/your-name/" method="post"& ...

  7. html的两种提交按钮submit和button

    转自:http://baiying.blog.51cto.com/1068039/1319784 html按钮有两种: <input type="button" value= ...

  8. form表单两种提交方式的不同

      我们在使用<Form>表单的时候,最常用的提交方式就是Get和Post.我们都知道这两种方式最大的差别就是安全性,除此之外,它们还有哪些其他的区别,你知道吗?   在<Form& ...

  9. form表单中get和post两种提交方式的区别

    一.form表单中get和post两种提交方式的区别? 1.get提交表单中的内容在链接处是可见的.post不可见 2.post相比于get是安全的 3.post不收限制大小,get有限制大小(黑马视 ...

随机推荐

  1. Windows中的原语与原子

    目前对原语与原子的理解为: 原语: 由内核提供的核外调用的一段具有特定功能的方法或者函数称之为---原语 原语操作不允许发生中断. 原子:         在多进程多线程的操作系统中不允许其他进程或者 ...

  2. 保存配置,获取配置,XML

    private void SaveSOConfig() { //保存配置 Dictionary<string, string> PrintConfigDIC = new Dictionar ...

  3. redis 在 php 中的应用(List篇)

    本文为我阅读了 redis参考手册 之后编写,注意 php_redis 和 redis-cli 的区别(主要是返回值类型和参数用法) 目录: List(列表) LPUSH LPUSHX RPUSH R ...

  4. python习题一

    1.26个字母大小写成对打印,例如:Aa,Bb...... 方法1: for i in range(26): print(chr(65+i)+chr(97+i)) 方法2: for i in rang ...

  5. js中的数组方法

    数组的方法有数组原型方法,也有从object对象继承来的方法,这里我们只介绍数组的原型方法,数组原型方法主要有以下这些: join()push()和pop()shift() 和 unshift()so ...

  6. cent OS 7查询IP

    环境: win7旗舰版 VMware Workstation Pro (虚拟机软件) CentOS-7-x86_64-DVD-1804.iso 安装时选择了默认配置,最小系统安装. 安装好后用  if ...

  7. vuex store刷新存储状态

    app.vue 平时不想把信息存到session里,只有无可奈何的时候才准备村 <script> export default { name: 'App', created() { //刷 ...

  8. Ubuntu查看crontab运行日志

    Ubuntu服务器/var/log下没有cron日志,这里记录一下如何ubuntu server如何查看crontab日志 crontab记录日志修改rsyslogsudo vim /etc/rsys ...

  9. Java ascii码值转为输出ascii码

    Java ascii码值转为输出ascii码 public static void main(String[] args) { // TODO Auto-generated method stub S ...

  10. android开发_Eclipse新建项目+新建模拟器

    一.新建项目 1 Eclipse->右键->new->Android Application Project,得到下图: 2 输入创建项目信息 3 点击next 4 点击 next ...