javascript键盘事件表单交互

键盘选择表单
  <style type="text/css"> 
  *{ 
  margin:0px;padding:0px;font-size:12px; 
  } 
  input{ 
      width:100px;height:20px;border:1px solid #ccc; 
    } 
TD { cursor: hand; }    
  </style> 
  <script language="javascript" type="text/javascript">    
    function document.onkeydown(){   
     if(document.all('oTable')){ 
         var rowsArray = document.all('oTable').rows;   
         for(var i=0;i<rowsArray.length;i++){   
              if(rowsArray[i].children[0].style.backgroundColor=='#dcdcdc'){   
                 switch(window.event.keyCode){   
                     case 38 :   
                         if(i-1>=0){   
                           rowsArray[i-1].children[0].style.backgroundColor = '#dcdcdc';    
                           rowsArray[i].children[0].style.backgroundColor = '';   
                         }   
                         break;   
                     case 40 :   
                         if(i+1<=rowsArray.length-1){   
                            rowsArray[i+1].children[0].style.backgroundColor = '#dcdcdc';     
                            rowsArray[i].children[0].style.backgroundColor = '';   
                         }   
                         break;                            
                     case 13 :   
                 var str = rowsArray[i].childNodes[0].innerHTML; 
               document.getElementById("username").value = str; 
               document.getElementById("tips").style.display='none';             
                        break;    
                 break;   
              }   
         }   
         } 
      }   
      function document.onclick(){   
       if(document.all('oTable')){ 
          if(window.event.srcElement.tagName!='TD'){ return; }   
          var rowsArray = document.all('oTable').rows;   
          for(var i=0;i<rowsArray.length;i++){   
               if(rowsArray[i].cells[0]==window.event.srcElement){   
                  rowsArray[i].cells[0].style.backgroundColor = '#dcdcdc';   
               }else{   
                  rowsArray[i].cells[0].style.backgroundColor = '';   
               }   
          }    
        }          
      }   


  function doaaa(id) 
  { 

  var str = id.childNodes[0].innerHTML; 
  alert(str); 
    document.getElementById("username").value = str; 
    document.getElementById("tips").style.display='none'; 
  return true; 
  } 
var aid = new Array("人民币","美刀","英镑","欧元","港币"); 
function tips(id,str){ 
var l=document.getElementById(id).offsetLeft+120; 
var t=document.getElementById(id).offsetTop; 
var htmlstring ="<table id=\"oTable\" width=\"100\">"; 
for(var i=0;i<aid.length;i++){ 
if(i==0){htmlstring = htmlstring+"<tr height=\"20\" onclick=\"doaaa(this);\"><td style=\"background-color:#dcdcdc;\">0"+i+":"+aid[i]+"</td></tr>";} 
else{htmlstring = htmlstring+"<tr height=\"20\" onclick=\"doaaa(this);\"><td>0"+i+":"+aid[i]+"</td></tr>";} 

} 
htmlstring = htmlstring+"</table>"; 
var inheight = aid.length*22+"px"; 
document.getElementById("tips").innerHTML=htmlstring; 
document.getElementById("tips").style.left=l+"px"; 
document.getElementById("tips").style.top=t+"px"; 
document.getElementById("tips").style.height=inheight; 
document.getElementById("tips").style.display="block"; 
} 
function outtips(){ 
for(var i=0;i<aid.length;i++){ 
 if(document.getElementById("username").value=="0"+i)  
  document.getElementById("username").value=aid[i]; 
} 
    //if(document.getElementById("username").value==0+"")  
  //  document.getElementById("tips").style.display='none'; 
} 
</script> 
</head> 
<body> 

                     
<div id="tips" style="position:absolute;border:1px solid #ccc;padding:0px 3px;color:#f00;display:none;height:200px;line-height:20px;background:#fcfcfc"></div> 
<br /> 
姓名:<input type="text" id="username" onfocus="tips('username','姓名长度最多16个字符')" onblur="outtips()" /> 
<br /> 
密码:<input type="password" id="password" onfocus="tips('password','密码长度必须在3-18位之间')" onblur="outtips()" /> 

 

 

Msdn Menu

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>MSND menu</title> 
<meta name="Generator" content="EditPlus"> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<style> 
.LocaleManagementFlyoutPopup { 
 font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  border:1px solid #666666; 
  padding: 3px 3px 3px 3px; 
  text-align: left; 
  background-color: #FFFFFF; 
  z-index: 10; 
  opacity: .95; 
  filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2,OffY=2,Color='silver',Positive='true') alpha(opacity=95); 
} 

.LocaleManagementFlyoutPopup A, .LocaleManagementFlyoutPopup A:visited { 
  font-size: 10px; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #FFFFFF; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-align: left; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopup A:hover { 
  background-color: #f0f7fd; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #addbef; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopupHr { 
 height: 1px; 
 background: #d0e0f0; 
 margin: 0px 11px 21px 11px; 
} 

.LocaleManagementFlyoutPopArrow { 
  margin: 4px 0px 0px 0px; 
} 

.LocaleManagementFlyoutStatic_msdn { 
 border: 1px solid #ffffff; 
} 

.LocaleManagementFlyoutStaticHover_msdn { 
 border: 1px solid #addbef; 
} 

.TFlyPopupAnimate { 
 position: absolute; 
 display: block; 
 border: 1px solid gray; 
 overflow: hidden; 
 visibility: hidden; 
 margin: 0; 
 padding: 0; 
 z-index: 1; 
} 
</style> 
<script> 
/* 
name 对象的 id 值 
offsetLeft 定位:左 - 偏移量 
offsetTop 定位:顶部 - 偏移量 
alignment 对齐方式{-1: left; 0: center; 1: right} 
anyIter 显示方式(<=0: 普通样式; >0: 缩放样式) 
anyTime 动画时间间隔 
staticHover 鼠标覆盖时的样式 
popupHover 显示内容鼠标覆盖时的样式 
popupLatency 显示内容延时 
hideLatency 隐藏内容延时 
onInit 初始化 
onPopup 显示内容时行为 
onHide 隐藏内容时行为 
*/ 
function TFly_Init(name, offsetLeft, offsetTop, alignment, anyIter, anyTime, staticHover, popupHover, popupLatency, hideLatency, onInit, onPopup, onHide) { 
 var TFly = document.getElementById(name); 
 TFly.DT = document.getElementById(name + "_Popup"); // 显示内容对象 
 TFly.F = document.getElementById(name + "_Anim"); // 动画效果对象 
 TFly.oX = offsetLeft; 
 TFly.oY = offsetTop; 
 TFly.alignment = alignment; 
 TFly.AnyIter = anyIter; 
 TFly.AnyTime = anyTime; 

 TFly.popupLatency = popupLatency; 
 TFly.hideLatency = hideLatency; 
 TFly.onPopup = onPopup; 
 TFly.onHide = onHide; 

 TFly.onmouseover = function() { 
 if (staticHover != '') { // 替换样式,并储存原来的样式 
     TFly.className_ = TFly.className; 
      TFly.className = staticHover; 
    } 
 TFly_Popup(TFly, true); 
  } 

 TFly.onmouseout = function() { 
   if (staticHover != '') { // 恢复原来的样式 
     TFly.className = TFly.className_; 
    } 
    TFly_Popup(TFly, false); 
  } 

 if (document.all) { 
 TFly.onactivate = TFly.onmouseover; 
 TFly.ondeactivate = TFly.onmouseout; 
 } else { 
 TFly.onfocus = TFly.onmouseover; 
 TFly.onblur = TFly.onmouseout; 
 } 

 TFly.DT.onmouseover = function() { 
 if (popupHover != '') { 
     TFly.DT.className_ = TFly.DT.className; 
      TFly.DT.className = popupHover; 
    } 
    TFly_Popup(TFly, true); 
  } 

 TFly.DT.onmouseout = function() { 
   if (popupHover != '') { 
 TFly.DT.className = TFly.DT.className_; 
    } 
   TFly_Popup(TFly, false); 
 } 

 TFly_CallClientFunction(onInit, TFly); 
} 

// 调用初始化程序 
function TFly_CallClientFunction(name, TFly) { 
 if (name != null && name != "") 
 eval(name + "(TFly);"); 
} 

// 定位 
function TFly_SetPosition(TFly, obj) { 
 obj.style.top = TFly.oY + TFly.offsetHeight + "px"; 
 obj.style.left = TFly.oX + (TFly.offsetWidth - obj.offsetWidth ) * (1 + TFly.alignment) / 2 + "px"; 
} 

function TFly_Popup(TFly, value) { 
 if (TFly.timer != null) window.clearTimeout(TFly.timer); // 清除超时 

 if (value) { // 判断状态 
 if (TFly.status == "on") return; 

 // 如果 popup 已经显示,则显示延时为 0 
    // 例如从一个菜单移动到另外一个菜单 
    var timeout = (TFly.status == "active") ? 0 : TFly.popupLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, true, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, true);}, timeout); 

 } else { 
 if (TFly.status == "off") return; 

 var timeout = (TFly.status == "active") ? 0 : TFly.hideLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, false, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, false);}, timeout); 
 } 
} 

// 设置弹出内容的可见性 
function TFly_SetVisibility(TFly, value) { 
 if (value == true) { 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.DT.style.visibility = "visible"; 
 TFly.style.zIndex = "999"; 
 } else { 
 TFly.DT.style.visibility = "hidden"; 
 TFly.style.zIndex = "0"; 
 TFly.DT.style.left = "-10000px"; 
 } 
} 

function TFly_AnimateStart (TFly, inout, curIter) { 
 if (TFly.F.timer != null) window.clearTimeout(TFly.F.timer); 

 if (curIter == null) curIter=0; 

 if (TFly.status != "active") { 
 TFly.status = "active"; 
 TFly.F.style.visibility = "visible"; 
 TFly.DT.style.visibility = "hidden"; 
 } 

 if (curIter < 0 || curIter > TFly.AnyIter) { 
 TFly.F.curIter = (curIter < 1) ? 0 : TFly.AnyIter; 
 TFly.status = (TFly.F.curIter == TFly.AnyIter) ? "on": "off"; 
 TFly.F.style.visibility = "hidden"; 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.style.zIndex = (TFly.F.curIter == TFly.AnyIter) ? "999" : "0"; 

 if (TFly.F.curIter == TFly.AnyIter) { 
 TFly.status = "on"; 
 TFly_SetVisibility(TFly, true); 
 TFly_CallClientFunction(TFly.onPopup, TFly); 
 } else { 
 TFly.status = "off"; 
 TFly_SetVisibility(TFly, false); 
 TFly_CallClientFunction(TFly.onHide, TFly); 
 } 
 } else { 
 var per = curIter * (95 / TFly.AnyIter) + 5; 
 TFly.F.style.visibility = "hidden"; 
 TFly.F.style.width = TFly.DT.offsetWidth / 100 * per + "px"; 
 TFly.F.style.height = TFly.DT.offsetHeight / 100 * per + "px"; 
 TFly_SetPosition(TFly, TFly.F); 
 TFly.F.style.visibility = "visible"; 
 var timeout = (per == 100 ) ? 0 : TFly.AnyTime - (TFly.AnyTime / (TFly.AnyIter) * (curIter)); 
 curIter += (inout) ? 1 : -1; 
 TFly.F.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, inout, curIter)}, timeout); 
 TFly.F.curIter = curIter; 
 } 
} 
</script> 
</head> 

<body> 
           

<div style="display:inline;vertical-align:middle"> 
  <div class="LocaleManagementFlyoutStatic_msdn" style="position:relative;" id="LocaleManagement"> 
    <a class="LocaleManagementFlyoutStaticLink_msdn" href="javascript:void(0)">United States - English </a><img class="LocaleManagementFlyoutPopArrow" src="http://msdn2.microsoft.com/msdn/Controls/UserRecognitionFlyout/en-us/popdownarrow-msdn-left.gif" alt="Dropdown Arrow" style="height:4px;width:7px;border-width:0px;" /><div id="LocaleManagement_Popup" class="LocaleManagementFlyoutPopup" style="position: absolute;visibility:hidden;left:-65534px;"> 
      <table border="0" style="width:175px;"> 
        <tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl05','')">Australia (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl06','')">Brasil (Portugués)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl07','')">Canada (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl08','')">Canada (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl09','')">中国 (简体中文)</a></td> 
        </tr><tr> 

          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl10','')">Deutschland (Deutsch)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl11','')">France (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl12','')">India (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl13','')">Россия (Pусский)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl14','')">United Kingdom (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl15','')">United States (English)</a></td> 
        </tr><tr> 
          <td class="LocaleManagementFlyoutPopupHr"></td> 
        </tr><tr> 
       
            <td><a href="#" target=_blank>更多</a></td> 
        </tr> 
      </table></div> 
      <div id="LocaleManagement_Anim" class="TFlyPopupAnimate"></div> 
  </div> 
   
</div> 

<script> 
TFly_Init('LocaleManagement', 0, 0, -1, 2, 60, 'LocaleManagementFlyoutStaticHover_msdn', '', 100, 400, '', '', ''); 
</script> 
</body> 
</html>

 

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title>MSND menu</title> 
<meta name="Generator" content="EditPlus"> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
<style> 
.LocaleManagementFlyoutPopup { 
 font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; 
  border:1px solid #666666; 
  padding: 3px 3px 3px 3px; 
  text-align: left; 
  background-color: #FFFFFF; 
  z-index: 10; 
  opacity: .95; 
  filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2,OffY=2,Color='silver',Positive='true') alpha(opacity=95); 
} 

.LocaleManagementFlyoutPopup A, .LocaleManagementFlyoutPopup A:visited { 
  font-size: 10px; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #FFFFFF; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-align: left; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopup A:hover { 
  background-color: #f0f7fd; 
  color: #000000; 
  cursor: hand; 
  border: 1px solid #addbef; 
  padding: 1px 3px 1px 3px; 
  height: 15px; 
  text-decoration: none; 
  white-space: nowrap; 
  display: block; 
} 

.LocaleManagementFlyoutPopupHr { 
 height: 1px; 
 background: #d0e0f0; 
 margin: 0px 11px 21px 11px; 
} 

.LocaleManagementFlyoutPopArrow { 
  margin: 4px 0px 0px 0px; 
} 

.LocaleManagementFlyoutStatic_msdn { 
 border: 1px solid #ffffff; 
} 

.LocaleManagementFlyoutStaticHover_msdn { 
 border: 1px solid #addbef; 
} 

.TFlyPopupAnimate { 
 position: absolute; 
 display: block; 
 border: 1px solid gray; 
 overflow: hidden; 
 visibility: hidden; 
 margin: 0; 
 padding: 0; 
 z-index: 1; 
} 
</style> 
<script> 
/* 
name 对象的 id 值 
offsetLeft 定位:左 - 偏移量 
offsetTop 定位:顶部 - 偏移量 
alignment 对齐方式{-1: left; 0: center; 1: right} 
anyIter 显示方式(<=0: 普通样式; >0: 缩放样式) 
anyTime 动画时间间隔 
staticHover 鼠标覆盖时的样式 
popupHover 显示内容鼠标覆盖时的样式 
popupLatency 显示内容延时 
hideLatency 隐藏内容延时 
onInit 初始化 
onPopup 显示内容时行为 
onHide 隐藏内容时行为 
*/ 
function TFly_Init(name, offsetLeft, offsetTop, alignment, anyIter, anyTime, staticHover, popupHover, popupLatency, hideLatency, onInit, onPopup, onHide) { 
 var TFly = document.getElementById(name); 
 TFly.DT = document.getElementById(name + "_Popup"); // 显示内容对象 
 TFly.F = document.getElementById(name + "_Anim"); // 动画效果对象 
 TFly.oX = offsetLeft; 
 TFly.oY = offsetTop; 
 TFly.alignment = alignment; 
 TFly.AnyIter = anyIter; 
 TFly.AnyTime = anyTime; 

 TFly.popupLatency = popupLatency; 
 TFly.hideLatency = hideLatency; 
 TFly.onPopup = onPopup; 
 TFly.onHide = onHide; 

 TFly.onmouseover = function() { 
 if (staticHover != '') { // 替换样式,并储存原来的样式 
     TFly.className_ = TFly.className; 
      TFly.className = staticHover; 
    } 
 TFly_Popup(TFly, true); 
  } 

 TFly.onmouseout = function() { 
   if (staticHover != '') { // 恢复原来的样式 
     TFly.className = TFly.className_; 
    } 
    TFly_Popup(TFly, false); 
  } 

 if (document.all) { 
 TFly.onactivate = TFly.onmouseover; 
 TFly.ondeactivate = TFly.onmouseout; 
 } else { 
 TFly.onfocus = TFly.onmouseover; 
 TFly.onblur = TFly.onmouseout; 
 } 

 TFly.DT.onmouseover = function() { 
 if (popupHover != '') { 
     TFly.DT.className_ = TFly.DT.className; 
      TFly.DT.className = popupHover; 
    } 
    TFly_Popup(TFly, true); 
  } 

 TFly.DT.onmouseout = function() { 
   if (popupHover != '') { 
 TFly.DT.className = TFly.DT.className_; 
    } 
   TFly_Popup(TFly, false); 
 } 

 TFly_CallClientFunction(onInit, TFly); 
} 

// 调用初始化程序 
function TFly_CallClientFunction(name, TFly) { 
 if (name != null && name != "") 
 eval(name + "(TFly);"); 
} 

// 定位 
function TFly_SetPosition(TFly, obj) { 
 obj.style.top = TFly.oY + TFly.offsetHeight + "px"; 
 obj.style.left = TFly.oX + (TFly.offsetWidth - obj.offsetWidth ) * (1 + TFly.alignment) / 2 + "px"; 
} 

function TFly_Popup(TFly, value) { 
 if (TFly.timer != null) window.clearTimeout(TFly.timer); // 清除超时 

 if (value) { // 判断状态 
 if (TFly.status == "on") return; 

 // 如果 popup 已经显示,则显示延时为 0 
    // 例如从一个菜单移动到另外一个菜单 
    var timeout = (TFly.status == "active") ? 0 : TFly.popupLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, true, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, true);}, timeout); 

 } else { 
 if (TFly.status == "off") return; 

 var timeout = (TFly.status == "active") ? 0 : TFly.hideLatency; 

 if (TFly.AnyIter > 0 && TFly.AnyTime > 0) 
 TFly.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, false, TFly.F.curIter);}, timeout); 
 else 
 TFly.timer = window.setTimeout(function() {TFly_SetVisibility(TFly, false);}, timeout); 
 } 
} 

// 设置弹出内容的可见性 
function TFly_SetVisibility(TFly, value) { 
 if (value == true) { 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.DT.style.visibility = "visible"; 
 TFly.style.zIndex = "999"; 
 } else { 
 TFly.DT.style.visibility = "hidden"; 
 TFly.style.zIndex = "0"; 
 TFly.DT.style.left = "-10000px"; 
 } 
} 

function TFly_AnimateStart (TFly, inout, curIter) { 
 if (TFly.F.timer != null) window.clearTimeout(TFly.F.timer); 

 if (curIter == null) curIter=0; 

 if (TFly.status != "active") { 
 TFly.status = "active"; 
 TFly.F.style.visibility = "visible"; 
 TFly.DT.style.visibility = "hidden"; 
 } 

 if (curIter < 0 || curIter > TFly.AnyIter) { 
 TFly.F.curIter = (curIter < 1) ? 0 : TFly.AnyIter; 
 TFly.status = (TFly.F.curIter == TFly.AnyIter) ? "on": "off"; 
 TFly.F.style.visibility = "hidden"; 
 TFly_SetPosition(TFly, TFly.DT); 
 TFly.style.zIndex = (TFly.F.curIter == TFly.AnyIter) ? "999" : "0"; 

 if (TFly.F.curIter == TFly.AnyIter) { 
 TFly.status = "on"; 
 TFly_SetVisibility(TFly, true); 
 TFly_CallClientFunction(TFly.onPopup, TFly); 
 } else { 
 TFly.status = "off"; 
 TFly_SetVisibility(TFly, false); 
 TFly_CallClientFunction(TFly.onHide, TFly); 
 } 
 } else { 
 var per = curIter * (95 / TFly.AnyIter) + 5; 
 TFly.F.style.visibility = "hidden"; 
 TFly.F.style.width = TFly.DT.offsetWidth / 100 * per + "px"; 
 TFly.F.style.height = TFly.DT.offsetHeight / 100 * per + "px"; 
 TFly_SetPosition(TFly, TFly.F); 
 TFly.F.style.visibility = "visible"; 
 var timeout = (per == 100 ) ? 0 : TFly.AnyTime - (TFly.AnyTime / (TFly.AnyIter) * (curIter)); 
 curIter += (inout) ? 1 : -1; 
 TFly.F.timer = window.setTimeout(function() {TFly_AnimateStart(TFly, inout, curIter)}, timeout); 
 TFly.F.curIter = curIter; 
 } 
} 
</script> 
</head> 

<body> 
           

<div style="display:inline;vertical-align:middle"> 
  <div class="LocaleManagementFlyoutStatic_msdn" style="position:relative;" id="LocaleManagement"> 
    <a class="LocaleManagementFlyoutStaticLink_msdn" href="javascript:void(0)">United States - English </a><img class="LocaleManagementFlyoutPopArrow" src="http://msdn2.microsoft.com/msdn/Controls/UserRecognitionFlyout/en-us/popdownarrow-msdn-left.gif" alt="Dropdown Arrow" style="height:4px;width:7px;border-width:0px;" /><div id="LocaleManagement_Popup" class="LocaleManagementFlyoutPopup" style="position: absolute;visibility:hidden;left:-65534px;"> 
      <table border="0" style="width:175px;"> 
        <tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl05','')">Australia (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl06','')">Brasil (Portugués)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl07','')">Canada (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl08','')">Canada (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl09','')">中国 (简体中文)</a></td> 
        </tr><tr> 

          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl10','')">Deutschland (Deutsch)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl11','')">France (Fran?ais)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl12','')">India (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl13','')">Россия (Pусский)</a></td> 

        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl14','')">United Kingdom (English)</a></td> 
        </tr><tr> 
          <td><a href="javascript:__doPostBack('ctl00$BannerControl1$LocaleManagement$ctl00$ctl15','')">United States (English)</a></td> 
        </tr><tr> 
          <td class="LocaleManagementFlyoutPopupHr"></td> 
        </tr><tr> 
       
            <td><a href="#" target=_blank>更多</a></td> 
        </tr> 
      </table></div> 
      <div id="LocaleManagement_Anim" class="TFlyPopupAnimate"></div> 
  </div> 
   
</div> 

<script> 
TFly_Init('LocaleManagement', 0, 0, -1, 2, 60, 'LocaleManagementFlyoutStaticHover_msdn', '', 100, 400, '', '', ''); 
</script> 


</body> 
</html>

 

掌握JavaScript事件处理:从位置到表单再到DOM变化 本文深入探讨了JavaScript中的事件处理机制,包括鼠标移动时获取位置信息、键盘事件的触发与处理、表单事件在数据验证中的应用,以及DOM结构变化时的突变事件和观察者模式。通过具体的代码示例和场景应用,读者可以更好地理解如何在Web开发中有效利用事件监听来提升用户交互体验。 阅读详情

相关推荐

javascript网页键盘交互式代码

javascript网页键盘交互式代码

JavaScript 虚拟键盘:Mindfusion JavaScript Keyboard

高度交互,高度可定制--JavaScript 虚拟键盘--Mindfusion JavaScript Keyboard 现在,您的 JavaScript 应用程序可以像本地移动应用程序一样处理屏幕输入。

控件与插件之大全 1487

js两个列表框操作案例

有两个例子 一个是两个文本框之间值的对换,类似于招聘网的添加应聘职位对另一个文本框中 还有一个就是级联列表值,类似于省市县三级的级联列表

键盘辅助功能指南:JavaScript

大多数时候,使用 JavaScript 来增强组件的键盘可访问性的工作只需使用少数工具即可完成,包括使用事件侦听器和几个 Web API 的某些 JavaScript 方法,这些方法可以帮助我们完成此任务。我们必须为项目添加交互性的最重要的工具之一是事件的存在,即执行当您正在检查的元素收到更改时触发的函数。可以使用此 Web API 侦听的事件的一个示例是事件,该事件检查何时按下某个键。现在,这不用于为按钮或链接等元素添加键盘辅助功能,因为默认情况下,当您向它们添加事件侦听器时,当您使用 (for 按钮和链

liuhao9999的博客 746

Unity与IOS交互,调用IOS系统相机和相册

与IOS的交互,在步骤上要比android简单许多,不会产生因为系统版本,或者包名导致的许多问题。过程中最头疼的一个问题是IOS回调Unity,很简单的一个问题,搞了半天。

Hello Mingo 1万+

2021.11.23 Covins 多机器人单目协同建图 跑Euroc数据集 更新

近日,一直在调试如何使用Covins跑通数据集,因为是初学者,所以很多bug出来的时候原理都不懂,只能复制——百度——尝试解决的过程。 现分享一下近日的结果以及与Covins作者帮助解答的一些问题。 使用代码行跑依次跑Euroc多数据集 这里的意思是使用作者提供的covins_examples文件夹中的euroc_examples_mh123_vigba.sh文件,这个文件是将三个Euroc数据集依次运行,跑完第一个数据集,第二个数据集运行的时候在第一个数据集生成地图的基础上继续绘制,由于我只下载了两个数据

qq_42614598的博客 2475

p5.js入门教程(5) 键盘交互

一、键盘交互相关关键词与函数 keyIsPressed: 关键词,按下按键时为true,反之为false keyCode: 关键词,用于判断按下哪个按键 keyPressed():函数,按键按下时触发一次 keyReleased():函数,按键松开时触发一次 keyIsDown():函数,按下指定按键时返回true,反之为false 以下是一个较综合的案例,用wsad与zxcv控制小球...

西河某人的博客 4730

电流镜结构实战:从零理解MOS管偏置电路设计(附吴金课程补充)

本文深入解析电流镜结构在MOS管偏置电路设计中的关键作用,从基本原理到实战应用全面覆盖。通过分析偏置电路的核心原理、破解设计难题的实用技巧,以及进阶优化策略,帮助工程师掌握这一模拟电路设计的核心技术。特别适合需要理解电流镜结构和基准电路设计的读者参考学习。

ujm5678901的博客 256

JS事件属性总结【鼠标 / 键盘 / 表单】

前言: JS事件通常是指用户通过鼠标或者键盘以及其他方式对浏览器或浏览器网页中的某些节点或者元素进行操作,是用户与浏览器交互最为常见的方式,主要包含以下事件: 1、鼠标事件 2、键盘事件 3、表单事件 鼠标事件 下列代码使用了body作为点击的元素,需要在body中加入一个元素节点或文字节点,为方便区别比较,事件相近的做到了一起,常用的鼠标事件前加了 ✦ ✦1、onclick onclick是最常见的鼠标事件,由用户使用鼠标左键点击后触发相应的函数方法 document.body.onclick = fun

前端、python爱好者 1079

ISP之LSC(Lens Shading Correction)

LSC - Lens Shading Correction即镜头暗影校正。

IQ_WXY的博客 5098

【FDTD】仿真目录(共计 16 篇)

对于完美吸收型边界条件,有时候我们需要设置将仿真结构穿过边界条件区域,具体原因可以阅读下文。在进行 S 参数扫描时,当考虑到材料的色散特性时,我们可以如下文一样选择计算群延迟。仿真,我们需要构建仿真结构与仿真区域,对于它们的尺寸,应该遵循下文进行设定。中存在多种不同的网格类型,具体可以参考下文,这部分内容仅作了解即可。尺寸的设置问题,对于 mesh 的最小尺寸,可以参考下文。的边界条件设置也十分重要,下文中我们对边界条件进行总结。仿真中我们可以设定参与仿真的模式数量,可以参考下文。尺寸的实例,详见下文。

u011699626的博客 505

JS实现表单鼠标事件

<!DOCTYPE html> <html lang="zn"> <head> <meta charset="UTF-8"> <title>表单事件和鼠标、键盘事件</title> <style> .txt{ border-style: 2px solid; } </style> </head> <bod.

Hedia Pan的博客 223

(14-3)值分布式算法:QR-DQN (Quantile Regression DQN)算法

QR-DQN(Quantile Regression DQN)是一种强化学习算法,它是深度 Q-网络(Deep Q-Network,DQN)的一个变种,旨在更好地处理值函数的不确定性。QR-DQN的实现步骤与传统的DQN类似,但在目标分布计算和损失函数方面有一些不同之处,这使得它能够更好地处理值函数的不确定性。QR-DQN(Quantile Regression DQN)算法的核心思想是将值函数表示为一个分布,而不是传统的单一值估计。在下面的内容中,将讲解一个使用QR-DQN算法的例子。

码农三叔 2053

JavaScript常用事件详解

HTML 事件是发生在 HTML 元素上的事情。当在 HTML 页面中使用 JavaScript 时, JavaScript 可以触发这些事件。

仙草不加料的博客 232

RT-DETR的AIF模块+YOLOv8:融合注意力与特征交互,打造实时检测的科研级进阶方案

从理解AIF模块“细粒度注意力+跨尺度交互”的核心设计,到亲手将其嵌入YOLOv8并验证在复杂场景的表现,再到基于此探索属于自己的科研与工程方向——这个过程能让你深刻理解“注意力机制与CNN融合”在实时检测中的核心价值。现在就开始行动,相信你会在实时目标检测的“智能进化”之路上,走出一条属于自己的技术路径。从实验对比图可见,集成AIF模块的YOLOv8,其mAP(平均精度)在多个阈值下均有提升,尤其是mAP50-95(高IoU阈值下的精度)提升更为显著,充分证明了AIF对细粒度特征的捕捉能力。

m0_64661770的博客 188

YOLOv8改进-bifpn

跨尺度连接通过添加一个跳跃连接和双向路径来实现,自此实现了加权融合和双向跨尺度连接。该结构是加权且双向连接的,即自顶向下和自底向上结构,通过构造双向通道实现跨尺度连接,将特征提取网络中的特征直接与自下而上路径中的相对大小特征融合,保留了更浅的语义信息,而不会丢失太多的深层语义信息。传统的特征融合时将尺度不同的特征图以相同权重进行加权,但是当输入的特征图分辨率不同时,以相同的权重进行加权对输出的特征图不平等。所以BiFPN根据不同输入特征的重要性设置不同的权重,同时反复采用这种结构来加强特征融合。

weixin_45303602的博客 8139

JavaScript常用事件

概述: JS事件是当用户与网页进行交互时发生的事情,例如单机某个链接或按钮、在文本框中输入文字、按下键盘上的某个按键、移动鼠标等等。当事件发生时,可以使用JavaScript中的事件处理程序来检测并执行某些特定的程序。 一般情况下事件的名称都是以单词on开头的,例如点击事件onclick、页面加载事件onload等。 一、鼠标事件 onclick: 单击事件 ondblclick: 双击事件 onmousedown:鼠标按钮被按下 onmouseup:鼠标按键被松开 o

weixin_49187233的博客 1501

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

JavaScript DOM文档事件

可以触发浏览器的行为 js和html之间交互的触发点。1.6 onmouseout当鼠标移出时 不能阻止冒泡。1.3 onmousedown当鼠标按钮按下运行时事件。1.5 onmouseover当鼠标按钮运行时事件。1.4 onmouseup当鼠标按钮运行时事件。1.2 ondblclick鼠标双击事件。1.1 onclick鼠标单击事件。等,这些动作都属于窗体事件。

Ran小Ran的博客 960

VB摄像头监控

该VB模块可对摄像头捕获的画面进行录像等,可在创建的窗口进行控制

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

JavaScript常见的对象事件

在Web开发中,DOM(文档对象模型)事件监听是JavaScript与HTML元素进行交互的重要手段。通过监听和处理事件,我们可以响应用户的各种操作,如点击、输入、键盘按键等,从而创建动态和交互式的网页。本文将详细介绍DOM事件监听中的。

2401_82647012的博客 1996

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

javascript中的事件

javascript的事件

weixin_53484385的博客 172

JavaScript中on事件

javaScript中的部分on事件

qq_44738313的博客 1640

开发日常小记7-13

1、onkeypress="enterSearch()"是键盘按键按下后后,触发的方法,keyCode 为13是回车键 function enterSearch() { //回车键的值是13 if (event.keyCode == 13) { //调用搜索按键事件 $.table.search() } } 2、赋值时候,双引号,单引号不影响 1)$("#coldStorageCode").val();取值 2)$("#coldStorageCode

xiaoblank的博客 587

Javascript事件

一、Javascript 事件 1:鼠标事件 属性 描述 onclick 当用户点击某个对象时调用的事件句柄。 oncontextmenu 在用户点击鼠标右键打开上下文菜单时触发 ondblclick 当用户双击某个对象时调用的事件句柄。 onmousedown 鼠标按钮被按下。 onmo

ybyfu的博客 112
上一篇: 固定表头列头Javascript代码
下一篇: Javascript 弹出窗口大全
ghost_fly
博客等级 码龄20年 5粉丝 34原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值