`
孙健坤
  • 浏览: 42257 次
  • 性别: Icon_minigender_1
  • 来自: 长春
最近访客 更多访客>>
社区版块
存档分类
最新评论

两种解决用户名与密码都为空时焦点的问题

JavaScriptHTML 
阅读更多

第一种 定义一个表示是否已获得焦点的变量，是一种比较优雅的方法

 

<html>

  <head>

    <title>focus</title>

    <script type="text/javascript">

           function checkForm(myForm) {

              var msg = "";

              var setFocused = false; //是否已获得焦点

              if(myForm.account.value == "") {

                  msg += "帐号不能为空！\n";

                  myForm.account.focus();

                  setFocused = true;

              }

 

              if(myForm.password.value == "") {

                  msg += "密码不能为空！\n";

                  if(!setFocused) { //如果账号已获得了焦点 则密码不获得焦点

                     myForm.password.focus();

                     setFocused = true;

                  }

              }

             

              if(msg != "") {

                  alert(msg);

                  return false;

              }

             

              return true;

             

           }

       </script>

  </head>

 

  <body>

    <form action="" method="post" onsubmit="return checkForm(this);">

    <table>

        <tr>

              <td>

                  用户帐号

              </td>

              <td>

                  <input type="text" style="width:150px" name="account">

              </td>

           </tr>

           <tr>

              <td>

                  用户密码

              </td>

              <td>

                  <input type="password" style="width:150px" name="password">

              </td>

           </tr>

           <tr>

              <td colspan="2" align="center">

                  <input type="submit" value="登录">

                  <input type="reset" value="清空">

              </td>

           </tr>

    </table>

    </form>

  </body>

</html>

 

第二种 列出所有的情况，是一种比较笨拙的方法，只有两个字段还好，要是字段多了判断起来就麻烦了。

<html>

  <head>

    <title>focus</title>

    <script type="text/javascript">

           function checkForm(myForm) {

              var msg = "";

              if(myForm.account.value == "") {

                  msg += "帐号不能为空！\n";

                  myForm.account.focus();

              }

 

              if(myForm.account.value != "" && myForm.password.value == "") {

                  msg += "密码不能为空！\n";

                  myForm.password.focus();

              }

             

              if(myForm.account.value == "" && myForm.password.value == "") {

                  msg += "帐号不能为空！\n 密码不能为空！\n";

                  myForm.account.focus();

              }

             

              if(msg != "") {

                  alert(msg);

                  return false;

              }

              return true;

           }

       </script>

  </head>

 

  <body>

    <form action="" method="post" onsubmit="return checkForm(this);">

    <table>

        <tr>

              <td>

                  用户帐号

              </td>

              <td>

                  <input type="text" style="width:150px" name="account">

              </td>

           </tr>

           <tr>

              <td>

                  用户密码

              </td>

              <td>

                  <input type="password" style="width:150px" name="password">

              </td>

           </tr>

           <tr>

              <td colspan="2" align="center">

                  <input type="submit" value="登录">

                  <input type="reset" value="清空">

              </td>

           </tr>

    </table>

    </form>

  </body>

</html>

 

 

分享到：
| 诡异的内部类实例化方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js中判断文本框是否为空的两种方法.docx

    JS 中判断文本框是否为空的两种方法 在 JavaScript 中，判断文本框是否为空是一项常见的验证操作。以下我们将介绍两种方法来实现文本框非空验证。 方法一：使用 value 属性 在 HTML 文档中，我们可以使用 `value`...

    jQuery实用的注册表单验证代码.zip

    `blur`事件是当元素失去焦点时触发，非常适合实时验证用户输入。 首先，我们需要理解如何创建一个基本的注册表单。表单通常包含各种输入元素，如文本框（`&lt;input type="text"&gt;`）、密码框（`...

    带提示消息的TextBox和PasswordBox

    为了增加友好性，开发者通常会在TextBox控件为空时显示一条提示信息，如“请输入用户名”或“请输入您的姓名”。实现这一功能的方法之一是在TextBox的Text属性中设置默认的提示文本，并在控件获得焦点时清除该文本。...

    js效验输入有效性

    1. **非空验证**：确保用户名和密码字段不为空。可以使用`if`语句检查输入值的长度，例如`if (username === "" || password === "")`。 2. **长度限制**：限制用户名和密码的最小和最大长度。例如，可以设置用户名...

    VUE实现密码验证与提示功能

    在Vue.js框架中实现密码验证与提示功能是提高用户体验的重要一环，它可以帮助用户实时了解输入的密码是否符合预设的规则。在本文中，我们将探讨如何在Vue项目中创建一个组件，用于实现这一功能。 首先，我们需要...

    利用C#windows应用程序设计登陆界面

    - 在实际应用中，我们可能需要对用户输入进行验证，如检查用户名和密码是否为空，长度是否符合规定等。可以使用`string.IsNullOrEmpty()`函数来检查空值，用`Length`属性来检查长度。 - 对于密码，可以考虑使用...

    数据库编程

    如果这两个字段为空，程序会弹出错误消息框提示用户，并将焦点返回到相应文本框，以便用户可以立即输入缺失的信息。 接着，程序准备进行数据库验证。这里使用了一个SQL查询语句，其目的是根据用户输入的用户名查询`...

    AJAX 用户注册时的应用实例

    【AJAX 用户注册时的应用实例】在网页设计中，AJAX（Asynchronous JavaScript and XML）是一种用于创建交互式网页的编程技术。它允许在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页内容。在用户注册...

    AJAX技术详解及应用

    - `Login.jsp`文件包含了用户登录的界面，包括两个输入框（一个用于用户名，一个用于密码）以及登录按钮。当用户在输入框失去焦点时，`onBlur`事件触发`loginCheck()`函数。 - `loginCheck()`函数获取文本框中的值，...

    C#聊天程序的代码 基于。net

    如果用户名或密码为空，它会返回`false`并将焦点设在相应的文本框上，提示用户输入缺失的信息。 总的来说，这段代码展示了C#进行Windows桌面应用开发的基本结构，包括UI交互、事件驱动编程、对象的使用以及数据持久...

    ubuntu 14.04 忘记用户登录密码的图文解决方法

    本文将提供一种图文并茂的解决方法，帮助你重新设置密码，以便恢复正常操作。 首先，当你启动Ubuntu 14.04的虚拟机时，确保在虚拟机启动过程中立即点击屏幕，这将使鼠标焦点从VMware Workstation切换到Ubuntu的启动...

    xml+flash 幻灯焦点图片广告APS带后台版

    XML（eXtensible Markup Language）和Flash是两种在互联网早期广泛应用的技术，它们结合在一起可以创建动态、交互式的网页内容，如幻灯片焦点图片广告。这个“xml+flash 幻灯焦点图片广告APS带后台版”是一个基于XML...

    html5和css3炫酷用户登录界面模板

    另一方面，通过JavaScript，我们可以自定义验证逻辑，提供更具体的错误提示，比如在用户名或密码为空时弹出特定的提示框。 这个模板可能还包括了对响应式设计的考虑，利用媒体查询（media queries）根据设备的视口...

    云时代下的数据安全挑战和应对.pdf

    为了将这一解决方案落地，信长城提供了两种部署方案。第一种方案特点是低成本和无感操作，通过技术深度对接，实现账户+密码+账户标识证书的强身份认证。第二种方案则更注重客户端的集成，使用户在各种云平台上都能...

    WPF开发仿概念版QQ登录界面(超炫)

    4. **事件处理**: 为登录按钮添加Click事件，编写后台代码实现验证逻辑，如检查输入是否为空，与服务器进行身份验证等。 5. **交互逻辑**: 可以使用MVVM（Model-View-ViewModel）模式，分离视图和业务逻辑，提高代码...

    tubes_tubes_phpmysql_

    登录页面通常包括两个输入字段：一个用于用户名或电子邮件，另一个用于密码。用户输入他们的凭据后，这些信息会被发送到服务器，由PHP脚本处理。 在实现此功能时，PHP脚本首先需要连接到MySQL数据库，这通常通过...

    asp ajax 登陆

    这两种技术结合在一起，可以实现无刷新的登录功能，提供更好的用户体验。 在"asp ajax 登录"这个主题中，我们主要关注的是如何使用ASP处理后端逻辑，并通过AJAX进行前端与后端的异步通信。以下是对这个主题的详细...

    WPF程序长时间无人操作解决方案

    在软件开发中为了安全性，特别是那些需要用到用户名和密码登录服务端的程序，常常考虑长期无人操作，程序自动跳转到用户登录界面。判断程序是否长时间无人操作，有两个依据...本例综合这两种情况给出一个较好的解决方案

    Internet上的单点登录研究

    除了这两种协议，还有其他SSO实现，如Kerberos，它是一种在网络环境中进行身份验证的协议，尤其适用于企业内部网络。Kerberos基于密钥分发中心（KDC），用户在KDC获取票据授予票证（TGT），然后用TGT获取服务票证，...

    WPF的登录界面

    这通常涉及到与服务器或数据库的通信，检查用户名和密码是否匹配。在按钮的Click事件中，你可以编写这样的代码： ```csharp private async void btnLogin_Click(object sender, RoutedEventArgs e) { string ...

Magicbox
Global site tag (gtag.js) - Google Analytics