在javascript中如何屏幕HTML元素原有的事件,根据需要建立自己需要的事件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<script language="javascript">
	//将选择的select元素的值追加到输入框中原来数据的后面
function connectSex(){
	var sexTextObj=document.form1.sexText;
	var sexObj=document.form1.sex;
	var sexValue=sexObj.options[sexObj.selectedIndex].value;
	if(sexTextObj.value=="" || sexTextObj.value==null){
		sexTextObj.value=sexValue;
		}else{
			sexTextObj.value=sexTextObj.value+"、"+sexValue;
			}
	}

//目的在于学习如何屏蔽HTML元素原来已经有的事件,建立新的事件
function selectEvent(){
	if(event.keyCode==38 ||event.keyCode==40){
		//使HTML元素原来默认的事件失效
		  event.returnValue=false; 
			var selectObj=document.form1.sex;
	    var currentIndex=selectObj.selectedIndex;
		  //如果是上键:只是选中
		  if(event.keyCode==38 ){
		  	//alert("上键--"+currentIndex);
		  	if(currentIndex==0){
		  		return false;
		  		}else{
		  			selectObj.options[currentIndex-1].selected=true;
		  			return;
		  			}		  	
		  	}
		   //如果是下键
		  if(event.keyCode==40 ){
		  		//alert("下键--"+currentIndex+"selectObj.options.length:"+selectObj.options.length);
		  	if(currentIndex==selectObj.options.length-1){
		  		return false;
		  		}else{
		  			selectObj.options[1].selected=true;
		  			return ;
		  			}		  	
		  	}
		}
		//如果是空格键,则把选中的内容添加文本域中
		if(event.keyCode==32){
			connectSex();
			}
	}
	</script>
 </HEAD>

 <BODY>
  <form method="post" name="form1" action="">
   <input type="text" name="text1" value="text1"/>
   <input type="text" name="text2" value="text2"/><br/>
   <select name="sex" onChange="connectSex()" οnkeydοwn="selectEvent()">
   	<option value="girl">女</option>   	
   	<option value="boy">男</option>
  </select>
    <!--Tab键会自动跳过hidden类的控件-->
   <input type="hidden" name="text3" value="text3">
   <input type="text" name="sexText" value=""/>
   
  </form>
 </BODY>
</HTML>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值