weixin_52476750 2022-06-04 12:45 采纳率: 50%
浏览 37

表单验证无法实现怎么解决

表单验证不成功怎么解决呀？
验证密码不能为空和密码不能小于8位，如果不符合条件没有出现错误提示
如图，是函数代码

<script>
        function formcheck() {
            //验证用户名文本框是否为空
            if (document.login.nickname.value == "") {
                alert("请输入用户名！");
                document.login.username.focus();
                return false;
            }
            //验证密码文本框是否为空
            if (document.login.pwd.value == "") {
               alert("请输入密码！");
                document.login.pwd.focus();
                return false;
            }
            //验证密码是否是8位
            if (document.login.pwd.value.length < 8) {
                alert("请输入大于或等于8位数密码！");
                document.login.pwd.focus();
                return false;
            }
            return true;
        }
    </script>

下面是表单代码

<form name="login"  action="pwdchange.jsp" method="post" target="_blank" id="form" onsubmit="return formcheck();">
                                <div id="" class="col-md-6">
                                    <input type="password" class="form-control" name="pwd" id="pwd" placeholder="请输入修改密码" >
                                </div>
                                <input type="submit" value="保存" class="btn btn-primary">
                            </form>
  • 写回答

2条回答 默认 最新

  • Heerey525 前端领域新星创作者 2022-06-04 13:40
    关注

    form需要走校验规则的话不能自动提交，我改了下

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>页面名称</title>
  </head>
  <body>
    <form
      name="login"
      action="pwdchange.jsp"
      target="_blank"
      method="post"
      id="form"
      onsubmit="return false;"
    >
      <div id="" class="col-md-6">
        <input
          type="test"
          class="form-control"
          name="nickname"
          id="nickname"
          placeholder="请输入账号"
        />
        <input
          type="password"
          class="form-control"
          name="pwd"
          id="pwd"
          placeholder="请输入修改密码"
        />
      </div>
      <input
        type="submit"
        value="保存"
        class="btn btn-primary"
        onclick="formcheck()"
      />
    </form>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
      function formcheck() {
        //验证用户名文本框是否为空
        if (document.login.nickname.value == "") {
          alert("请输入用户名！");
          document.getElementById("nickname").focus();
          return false;
        }
        //验证密码文本框是否为空
        if (document.login.pwd.value == "") {
          alert("请输入密码！");
          document.getElementById("pwd").focus();
          return false;
        }
        //验证密码是否是8位
        if (document.login.pwd.value.length < 8) {
          alert("请输入大于或等于8位数密码！");
          // document.login.pwd.focus();
          document.getElementById("pwd").focus();
          return false;
        }
        var form = document.getElementById("form");
        form.submit();
      }
    </script>
  </body>
</html>
    评论

报告相同问题？

  • JS表单验证提交问题
    2009-12-10 23:01
    回答 5 已采纳
  • 现在表单验证用什么技术比较流行啊？
    2010-03-17 21:31
    回答 6 已采纳 表单验证一般客户端与服务端都要验证才能保证基本的数据正确， 我用过的有：struts validator 该框架可以同时生成服务端的验证与客户端的验证， 一般的验证内容可以満足。也可以自己支
  • 提交表单时如何既能先表单验证再访问action
    2012-07-06 18:06
    回答 1 已采纳
  • javascript.html实现表单验证
    2020-03-16 13:31
    附属：js文件附属:JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名的，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型...
  • jquery validate 让普通按钮 代替 submit 来激发表单验证
    2012-09-25 15:58
    回答 2 已采纳 //校验字段是否正确 function check(){ // 联系电话(手机/电话皆可)验证 jQuery.validator.addMethod("isPhone", fu
  • java 后台对前台的表单做非空验证，有必要吗
    2012-12-06 10:56
    回答 16 已采纳 前台的验证只是为了满足界面的友好性、客户体验性等等。 但是js本身不是安全的，同时浏览器可以禁用js，所以后台的校验还是必须的； 特别是应用如果不允许输入空值的情况下。
  • JSp页面传值和Ext JS表单自动填充
    2013-07-31 19:43
    回答 3 已采纳 不对，form.getForm().load({ url: 'DesignQuestions/ShowQueByIdJson.jsp',
  • html属于编程语言,HTML编程语言
    2021-06-10 04:16
    杏坛小子的博客 HTML编程语言文章目录HTML编程语言一、介绍二、作用三、HTML编程语言语法规范四、浏览器发送请求三要素:五、控制浏览器发送请求六、控制浏览器发送请求采用请求方式七.请求方式适用场景【面试】八。控制浏览器发送...
  • response.sendRedirect()跳转页面无法显示
    2013-07-29 15:20
    回答 1 已采纳 Ext 提交表单用的异步提交Ajax。Ajax在发送请求时后台返回的数据（json或者html页面）在其回调函数中处理。 你这个相当于后台把Center_right.jsp页面已经返回给前台了但是前
  • struts2 submit提交前的 javascript 验证问题
    2010-11-01 14:02
    回答 4 已采纳 [code="java"]onclick="window.submit = this"[/code] 记录点击按钮window.submi 记录了点击按钮 functi
  • GWT-EXT如何验证字段呢？
    2008-09-23 21:29
    回答 1 已采纳 [code="java"]VerticalPanel vp = new VerticalPanel(); vp.add(title); vp.add(description);
  • 2022年主要的编程语言及应用
    2022-04-19 22:53
    CodeJames的博客 如图一所示，展示了2022年编程语言的排行榜，有很多我们熟知的，也有很多不太清楚的语言，接下来就以我的理解来说一下各类主流语言的主要用途。
  • FCKeditor js 验证为空问题，多了一个<br/>
    2009-01-07 18:03
    回答 1 已采纳 在这段代码之前 [code="javascript"] oEditor.Focus(); [/code] 添加一行 [code="javascript"] oEditor.SetX
  • 如何有效学习C#编程语言
    2024-08-24 08:24
    专家大圣的博客 C#是一门功能强大且广泛应用的编程语言，无论是开发桌面应用、Web应用、移动应用，还是构建大型企业系统、游戏开发，C#都能为你提供强有力的支持。学习C#不仅能帮助你掌握编程的基本概念，还能为你打开通向软件开发...
  • 2023火爆的11门编程语言
    2023-06-20 10:51
    陆卿之SIN的博客 根据不同的应用领域和需求，不同的编程语言都有其独特的优势和适用性。无论使用何种语言只要能更好的实现需求，解决痛点问题，就是好语言。
  • 没有解决我的问题, 去提问

问题事件

  • 修改了问题 6月4日
  • 修改了问题 6月4日
  • 创建了问题 6月4日

悬赏问题

  • ¥25 自动填写QQ腾讯文档收集表
  • ¥15 DbVisualizer Pro 12.0.7 sql commander光标错位 显示位置与实际不符
  • ¥15 求一份STM32F10X的I2S外设库
  • ¥15 android 打包报错
  • ¥15 关于stm32的问题
  • ¥15 ncode振动疲劳分析中，noisefloor如何影响PSD函数？
  • ¥50 寻找fpga的benchmark
  • ¥50 如何在arduino上，实现用4×4矩阵键盘按键控制2004显示屏输出图中显示功能的代码？
  • ¥15 P1口接8个发光二极管，利用定时计数器1编写程序
  • ¥20 keil5编译找不到.h文件该如何解决