要求

1、用户名和密码为空点击登录时提示相应的提示

2、获取用户名输入框时，错误提示清除

思路

1、创建1个input-text标签和1个input-password标签，1个input-botton标签

2、把按钮绑定点击时间，然后检查所有输入框内容是否为空，为空则加上提示

3、把输入框绑定事件，获取焦点时清除提示

<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<!--设置用户名输入框-->

<label >用户名

<input id="t1" class='info' type="text">

    <!--空span标签用来后面绑定事件添加提示-->

    <span></span>

</label>

<hr>

<!--设置密码输入框-->

<label >密码

    <input id="t2" class="info" type="password">

     <!--空span标签用来后面绑定事件添加提示-->

    <span></span>

</label>

<hr>

<label id="b1">

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

</label>

<script src="JQ.js"></script>

<script>

    // 按钮绑定点击事件

    $('#b1').click(function () {

        let $name=$('#t1');

        let $pwd=$('#t2');

        // 按钮点击后检查输入框是否为空，为空则找到span便签添加提示

        if ($name.val().length===0)

        {

            $name.next().text('用户名不能为空')

        }

        if($pwd.val().length===0)

        {

            $pwd.next().text('密码不能为空')

        }

    });

    // 给输入框添加时间，获取焦点时,将span标签中的内容设置成空

    $('.info').focus(function () {

        $(this).next().text('');

    })

</script>

</body>

</html>

Jquery实现检测用户输入用户名和密码不能为空的更多相关文章

  1. 要求用户输入用户名和密码，只要不是admin、888888就

    要求用户输入用户名和密码,只要不是admin.888888就一直提示用户名或密码错误,请重新输入 Console.WriteLine("输入账号和密码"); string a = ...

  2. 在主函数中提示用户输入用户名和密码。另写一方法来判断用户输入是否正确。该方法分别返回一个bool类型的登录结果和和一个string类型的登录信息。如登录成功，返回true及“登录成功”，若登录失败则返回false及“用户名错误”或“密码错误”（使用out参数）

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. 服务器http://localhost:8080要求用户输入用户名和密码

    我们在将web项目部署运行的时候,想要在浏览器上输入http://localhost:8080时却提示: 如果你的电脑安装过Oracle的话,可能是和Oracle 的端口一样了,这是可以有两个办法解决 ...

  4. nginx配置访问密码，让用户输入用户名密码才能访问

    如果我们在 nginx 下搭建了一些站点,但是由于站点内容或者流量的关系,我们并不想让所有人都能正常访问,那么我们可以设置访问认证.只有让用户输入正确的用户名和密码才能正常访问.效果如下: 在 ngi ...

  5. git push不用重复输入用户名和密码（解决方案）

    每次git push都要输入用户名和密码,有点麻烦,就上网搜了下解决方案. 网上的解决方案有的讲得不清晰,逐个试了后,总结下两种有效的解决方案.   方案一: 1.在计算机安装盘(即一般为C盘)下找到 ...

  6. TortoiseGit 连接oschina不用每次输入用户名和密码的方法

    每次git clone 和push 都要输入用户名和密码.虽然安全,但在本机上每次都输有些麻烦,如何记住用户名和密码呢? 在网上看了各种方法,太杂,很多可能环境不一样,一直行不通.最后找到一种有效的方 ...

  7. iis配置好后，解决打开服务器要输入用户名和密码的问题

    [转]IIS网站访问需要输入用户名和密码 xp系统下安装IIS5,并设置好网站路径,但是访问网站时需要输入用户名和密码,这个问题极大可能是因为你网站放置在一个文件系统为NTFS的盘符上,而IIS默认的 ...

  8. 【IIS转】：解决IIS下localhost访问需要输入用户名和密码的问题

    [摘要]安装完IIS后,我们可能会发现浏览器输入localhost访问时提示我们输入用户名和密码,本文介绍了这种问题的解决方法,方便站长们调试自己的程序. 在我们的WIN XP系统中安装了IIS,但是 ...

  9. 避免git clone和push时每次都需要输入用户名和密码

    有三种方式解决git clone时每次都需要输入用户名和密码, 1. SSH免密方式 使用git bash ssh-keygen或puttygen.exe生成公钥. 2. 配置全局开机存储认证信息 下 ...

随机推荐

  1. AT1219 歴史の研究

    附带权值的类区间众数问题?不是很好策啊 发现题目没有强制在线,而且也只有询问操作,那么可以考虑莫队 但是这里的莫队有一个很显著的特征,插入的时候很好维护答案,但是删除的时候不好回退 那么有没有什么办法 ...

  2. 用HttpClient和用HttpURLConnection做爬虫发现爬取的代码少了的问题

    最近在学习用java来做爬虫但是发现不管用那种方式都是爬取的代码比网页的源码少了很多在网上查了很多都说是inputStream的缓冲区太小而爬取的网页太大导致读取出来的网页代码不完整,但是后面发现并不 ...

  3. stark组件的增删改

      1.效果图 2.详细步骤解析 3.总结.代码   1.效果图 增 删除 改 2.详细步骤解析 1.构造增删改查url,反向解析 2.ModelForm定制add.edit页面 3.starak中的 ...

  4. Shell脚本1

    1Shell编程 Shell 是一个用 C 语言编写的程序,它是用户使用 Linux 的桥梁.Shell 既是一种命令语言,又是一种程序设计语言. Shell脚本 Shell 脚本(shell scr ...

  5. 【问题解决方案】editplus中批量将ANSI转换为utf-8

    来自一个用editplus写java程序但是上传到GitHub里中文乱码的故事 大致步骤: editplus全部打开之后(打开为何种编码不重要): (全部打开是指在左下方的文件列表选中-->右击 ...

  6. TortoiseGit push免输密码

    (ฅ>ω<*ฅ) 噫又好了~ TortoiseGit push免输密码的方法 – 晨旭的博客~https://www.chenxublog.com/2016/03/04/tortoiseg ...

  7. WIN下修改host文件并立即生效

    怎样修改WIN7下的host文件_百度经验https://jingyan.baidu.com/article/9faa72317903f1473c28cb01.html hosts立即生效的方法 - ...

  8. React Native之图片保存到本地相册(ios android)

    React Native之图片保存到本地相册(ios android) 一,需求分析 1,react native保存网络图片到相册,iOS端可以用RN自带的CameraRoll完美解决,但是andr ...

  9. C#封装SQLite数据库

    网上有许多介绍关于SQLite数据库的,这里我就不多说了,这里主要介绍SQLite数据库在C#中的应用,它的应用主要依赖于System.Data.SQLite.dll文件,可以点击这里下载https: ...

  10. java设计模式：概述与GoF的23种设计模式

    软件设计模式的产生背景 设计模式这个术语最初并不是出现在软件设计中,而是被用于建筑领域的设计中. 1977 年,美国著名建筑大师.加利福尼亚大学伯克利分校环境结构中心主任克里斯托夫·亚历山大(Chri ...