模拟计算机病毒效果 js,用户登录模拟效果（原生js实现）

需求：

当用户名和密码获得焦点时，文本框背景颜色变黄，失去焦点时背景颜色恢复，

然后判断是否为空，如果为空，则给出提示，同时文本框继续获得焦点。如图所示。

单击登录按钮后，判断用户名(admin)和密码(123)是否正确。

若错误，则提示用户名或密码错误，

若正确，网页跳转到网页www.baidu.com.

function p1(){

document.getElementById("q1").innerHTML="";

document.getElementById("q2").innerHTML="";

var name = document.getElementById("name").value;

var pw = document.getElementById("pw").value;

if(name==""){

document.getElementById("q1").innerHTML="用户名不能为空！";

onover();

return;

}

if(name=="admin"){

if(pw=="123"){

window.location.href ='http://www.baidu.com';

}else{

document.getElementById("q2").innerHTML="密码错误！";

}

}else{

document.getElementById("q1").innerHTML="用户名错误！";

}

function onover(){

document.all.name.style.background="#EEEE00 ";

}

function onout(){

document.all.name.style.background="#fff";

}

function onover1(){

document.all.name.style.background="#fff";

document.all.pw.style.background="#EEEE00 ";

}

function onout1(){

document.all.pw.style.background="#fff";

}

.jdt{ width:400px; height:300px; border:1px #000 solid;}

#q1,#q2{color:red;}

用户登录

用户名：

密码：

模拟计算机病毒效果 js,用户登录模拟效果（原生js实现）相关推荐

js 封装ajax方法吗,原生JS封装ajax方法
jquery框架的ajax方法固然好用,但是假如某天我们的项目不能引入jquery或项目需求很简单,没有很多交互功能,只需要ajax,这时引入jquery库会造成资源浪费,也会显得页面臃肿.这时我们就 ...
html原生js实现图片轮播,原生JS实现图片轮播切换效果
原生JS实现图片轮播切换效果 2019-01-06 编程之家 https://www.jb51.cc 编程之家收集整理的这篇文章主要介绍了原生JS实现图片轮播切换效果,编程之家小编觉得挺不错的,现在分 ...
js 写html代码编辑器,原生JS写一个功能强大的编辑器
因为一个同学,要做一个能加入图片的留言板功能,类型与QQ空间留言板和百度贴吧发帖的那种形式,同时在网上找了找发生网上对这方面的交流很少,所以发表这篇文章抛砖引玉,希望能帮助广大的学习者,也同时希望大佬 ...
原生js写三级联动 java_原生js三级联动的简单实现代码
本文实例为大家分享了js查询天气应用,供大家参考,具体内容如下实现功能:打开网页时显示用户所在城市的天气状况,在输入框输入城市可查询其它城市. 实现过程:先调用百度地图的API来获取用户所在的城市, ...
js异步请求php数据,原生JS发送异步数据请求实例详解
这篇文章主要为大家详细介绍了原生JS发送异步数据请求的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下在做项目的时候,有时候需要用到异步数据请求,但是如果这个时候没有框架的依赖,就需要用到 ...
class 原生js获取父元素_原生js获取class
//使用原生js时,通过class名称就可以得到相应的class名称标签组封装的函数 //定义一个函数getClass(oParent,aClass); function getClass(oPare ...
原生js获取html元素高度,原生JS获取元素宽高实践详解
开篇的话任何不是亲身实践中求得的知识,都不是属于你的. 任何求得的知识不去时常温习运用,也不是属于你的. 记录由来在做个上拉广告功能中遇到了一个"理所当然"觉得对的用法,慢慢才 ...
js获取当前农历年月原生js实现公历转农历
原生js实现公历转农历(转载) 网上原生JS实现公历转农历的代码参差不齐,个人经过项目实践后发现有个博主的写的很好使用起来也很方便,于是一起分享给大家. 原博主的代码是在vue框架下写的,具体如下: ...
js控制鼠标移动_原生JS封装可拖拽效果
项目代码已上传码云:小朋友/JavaScript 封装可拖拽特效访问该URL可查看效果:http://is666a.gitee.io/javascript_drag/ https://www.zhi ...

模拟计算机病毒效果 js,用户登录模拟效果（原生js实现）

用户登录

模拟计算机病毒效果 js,用户登录模拟效果（原生js实现）相关推荐

最新文章

热门文章