首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

再次JS高人,连同上贴共赠200分

2012-03-27 
再次求助JS高人,连同上贴共赠200分我上个帖子的地址:http://community.csdn.net/Expert/topic/5742/574207

再次求助JS高人,连同上贴共赠200分
我上个帖子的地址:
http://community.csdn.net/Expert/topic/5742/5742077.xml?temp=.1596949
我想实现使子菜单被打开时自动获取焦点,点击ENTER时它(子菜单)还能打开一个URL连接.
只要您能帮我实现以上两个功能,连同上帖中的100共200分,相送;
代码如下:

<html>
<head>
<style   type= "text/css ">

<!--
input   {border:1px   solid   #fff; background:#fff;   }
input   {star   :   expression(

onmouseover=function(){this.style.backgroundColor= "#eee "},
onmouseout=function(){this.style.backgroundColor= "#fff "})}
.in40   {width:40px;}
.in80   {width:80px;}
.in120   {width:120px;}
.in200   {width:200px;}
-->
</style>
</head>
<body>
<script   defer>
var   obj=document.getElementsByTagName( "input ");
                var   urlpath   =   " ";
for(var   i=0;i <obj.length;i++)
if(obj[i].input)
{
obj[i].focus();
break;
}
document.onkeydown=function()
{
try{
//alert(event.keyCode);
if(event.keyCode==13){
//alert( "现在访问URL ");
window.open();
}
                //按esc键退出
             
if(event.keycode   ==   27)
            window.closed();
if(event.keyCode==40){
event.srcElement.nextSibling.nextSibling.focus();
showNone();
}
else   if(event.keyCode==38){
event.srcElement.previousSibling.previousSibling.focus();
showNone();
}

          else   if(event.keyCode==37){
  var   xxx   =   event.srcElement;//event.srcElement就是指向触发事件的元素,他是什么就有什么的属性;srcElement   是事件初始目标的html元素对象引用,因为事件通过元素容器层次冒泡,可以在任一层进行处理,所以由一个属性指向产生初始事件的元素是很有帮助的.有了元素的引用,就可以读/写改元素的属性,并调用他的任何方法.

  if(xxx.id   ==   "bb "){
        bbb.style.display   =   "none ";
  }else   if(xxx.id   ==   "cc "){
        ccc.style.display   =   "none ";
  }else   if(xxx.id   ==   "dd "){
        ddd.style.display   =   "none ";
  }
  }

    else   if(event.keyCode==39){
          var   xxx   =   event.srcElement;
  if(xxx.id   ==   "bb "){
        bbb.style.display   =   "block ";
  }else   if(xxx.id   ==   "cc "){
        ccc.style.display   =   "block ";
  }else   if(xxx.id   ==   "dd "){
        ddd.style.display   =   "block ";
  }
    }

}catch(e){}
}

function   url(obj){
urlpath   =obj.value;
//window.location.href=obj;
//alert(obj.value);
}
function   showNone(){
bbb.style.display   =   "none ";
ccc.style.display   =   "none ";
ddd.style.display   =   "none ";
}
</script>
<table>
<tr> <td>
<div   id= "aaa ">
<input   type=text   class= "in200 "   value= "http://www.google.com "   onfocus= "this.select();url(this) "   size= "40 "   id= "bb "> <br/>


<input   type=text   class= "in80 "   value= "菜单2 "   onfocus= "this.select();url(this) "   id= "cc "> <br/>
<input   type=text   class= "in80 "   value= "菜单3 "   onfocus= "this.select();url(this) "     id= "dd ">
</div>
</td>
<td>
<div   style= "display:none   "   id= "bbb "> <input   type=text   class= "in80 "   value= "菜单4 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单5 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单6 "   onfocus=this.select()   > </div>
<div   style= "display:none   "   id= "ccc ">  
<input   type=text   class= "in80 "   value= "菜单7 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单8 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单9 "   onfocus=this.select()   > </div>  
<div   style= "display:none   "   id= "ddd ">
<input   type=text   class= "in80 "   value= "菜单10 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单11 "   onfocus=this.select()   > <br/>
<input   type=text   class= "in80 "   value= "菜单12 "   onfocus=this.select()   > </div>  

</td> </tr>
</table>
</body>
</html>


[解决办法]
JF,哈哈
[解决办法]
<html>
<head>
<style type= "text/css ">

<!--
input {border:1px solid #fff; background:#fff; }
input {star : expression(

onmouseover=function(){this.style.backgroundColor= "#eee "},
onmouseout=function(){this.style.backgroundColor= "#fff "})}
.in40 {width:40px;}
.in80 {width:80px;}
.in120 {width:120px;}
.in200 {width:200px;}
-->
</style>
</head>
<body>
<script defer>
var obj=document.getElementsByTagName( "input ");
var urlpath = " ";
for(var i=0;i <obj.length;i++)
if(obj[i].input)
{
obj[i].focus();
break;
}
document.onkeydown=function()
{
try{
//alert(event.keyCode);
if(event.keyCode==13){
//alert( "现在访问URL ");
window.open();
}
//按esc键退出

if(event.keycode == 27)
window.closed();
if(event.keyCode==40){
event.srcElement.nextSibling.nextSibling.focus();
showNone();
}
else if(event.keyCode==38){
event.srcElement.previousSibling.previousSibling.focus();
showNone();
}

else if(event.keyCode==37){
var xxx = event.srcElement;
if(xxx.parentNode.id.indexOf( "F ")){
document.getElementById(xxx.parentNode.id).style.display= "none ";
}
}


else if(event.keyCode==39){
var xxx = event.srcElement;
document.getElementById(xxx.id+ "F ").style.display= "block ";
document.getElementById(xxx.id+ "F ").getElementsByTagName( "input ")[0].select();
}

}catch(e){}
}

function url(obj){
urlpath =obj.value;
}
function showNone(){
bbb.style.display = "none ";
ccc.style.display = "none ";
ddd.style.display = "none ";
}
</script>
<table>
<tr> <td>
<div id= "aaa ">
<input type=text class= "in200 " value= "http://www.google.com " onfocus= "this.select();url(this) " size= "40 " id= "bb "> <br/>
<input type=text class= "in80 " value= "菜单2 " onfocus= "this.select();url(this) " id= "cc "> <br/>
<input type=text class= "in80 " value= "菜单3 " onfocus= "this.select();url(this) " id= "dd ">
</div>
</td>
<td>
<div style= "display:none " id= "bbF "> <input type=text class= "in80 " value= "菜单4 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单5 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单6 " onfocus=this.select() > </div>
<div style= "display:none " id= "ccF " >
<input type=text class= "in80 " value= "菜单7 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单8 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单9 " onfocus=this.select() > </div>
<div style= "display:none " id= "ddF ">
<input type=text class= "in80 " value= "菜单10 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单11 " onfocus=this.select() > <br/>
<input type=text class= "in80 " value= "菜单12 " onfocus=this.select() > </div>
</td> </tr>
</table>
</body>
</html>

热点排行