JavaScript中的表单中onblure失去焦点事件

- 日理万妓 2022-04-24 06:10 222阅读 0赞

**事件的语法结构**

1.  事件目标 .事件类型=事件处理程序

window.function(){
    				// alert('加载事件的处理程序');
    				}

window 是事件的目标 事件的类型是load =加function()后面是事件的处理程序  
2.onblure 失去焦点

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    		<style>			
    		</style>		
    		<script type="text/javascript">
    			window.function(){
    				var Txt=document.getElementById('txt');
    				var span_content=document.getElementById('span_01');
    				//onblur 在对象失去焦点时候发生的事件
    				Txt.function(){
    					//alert('===');
    					 Txt_content=Txt.value;
    					if(Txt_content=='admin'){
    						//alert('输入的账户正确！');
    						span_content.innerHTML='';
    						
    					}
    					else{
    						//alert('账户错误，请重新输入！');						
    						span_content.innerHTML='输入的账户错误，请重新输入！';
    						span_content.style.color='red';
    					}
    				}
    				
    				var Pwd=document.getElementById('pwd');
    				var span_pwd=document.getElementById('span_02');
    				Pwd.function(){
    					 Pwd_Content=parseFloat(Pwd.value); 
    					if(Pwd_Content==888888){						
    						span_pwd.innerHTML='';
    					}
    					//防止和上一个框出现空白的出现提示
    					else if(Txt_content!='admin'){
    						span_pwd.innerHTML='';
    					}				
    					else{					
    						span_pwd.innerHTML='输入的密码错误，请重新输入！';
    						span_pwd.style.color='red';
    					}
    				}
    				var Sub=document.getElementById('sub');
    				Sub.function(){
    					if(Txt_content=='admin'&&Pwd_Content==888888){
    						alert('登录成功！')
    					}
    				}
    			}	
    		</script>
    	</head>
    	<body>
    		输入账号：<input type="text" id="txt" />
    				 <span id="span_01"></span><br />		
    		密码：<input type="password" id="pwd" />	
    				<span id="span_02"></span><br />
    			  <input type="submit" value="登录"  id="sub"/>
    		
    </body>
    </html>