软件开发培训班 >> 编程开发 >> JavaScript

JavaScript 关于元素获取焦点(隐藏元素与div)

　　本文标签：元素,焦点

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>关于元素获取焦点</title> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<style> 
body { margin: 32px; font-family: Verdana, sans-serif; font-size: 14px; } 
.title { font-size: 18px; font-weight: bolder;margin:40px 0; } 
</style> 
</head> 
<body> 
<div class="title">关于元素获取焦点：</div> 
<div class="title">1，隐藏元素无法获取焦点</div> 
<p>下面有个隐藏的Input:</P> 
<p style="display:none;"><input class="input" id="textbox" name="textbox" value="Hi,Jb51!!!" /></P> 
<input type="button" onclick="process0();" value="无法使隐藏元素获取焦点"> 
<p>解决方法：先把元素显示，在获取焦点 。</P><div class="tj_content hidden-xs"><table width=600 border=0 cellspacing=0 cellpadding=2 align=center class=title14><tr align=center><td><a href="http://www.zhujiangroad.com/news/html/2021/10m84062.html"  target=_blank > 人民网评：不要再为不良软件贡献流量，沦为被收割的“韭菜”了 </a></td><td><a href="http://www.zhujiangroad.com/net/news/2020/3m81450.html"  target=_blank > 带上口罩才看清移动、联通、电信的真面目，错怪你们了！ </a></td></tr> <tr align=center><td><a href="http://www.zhujiangroad.com/net/html/76175.html"  target=_blank > 如何提高网站价值？提高网站价值七种内容策略 </a></td><td><a href="http://www.zhujiangroad.com/dc/news/2013/5a16330.html"  target=_blank > 抓住摄影的灵魂 风光摄影用光技巧揭秘 </a></td></tr></table></div> 
<div class="title">2，对于div等特殊元素获取焦点</div> 
<div id="a" >我是DIV元素，我不带tabindex="-1" 。</div> 
<input type="button" onclick="process1();" value="Div不能获取焦点"> 
<div id="b" tabindex="-1">我是DIV元素，我带tabindex="-1",点击下面按钮试试效果 。</div> 
<input type="button" onclick="process2();" value="使Div获取焦点"> 
<script> 
function process0(){ 
var textbox = document.getElementById("textbox"); 
textbox.onfocus = function(){alert(获取焦点);} 
textbox.focus(); 
} 
function process1(){ 
var a = document.getElementById("a"); 
a.onfocus = function(){alert(获取焦点);} 
a.focus(); 
} 
function process2(){ 
var b = document.getElementById("b"); 
b.onfocus = function(){alert(获取焦点);} 
b.focus(); 
//非常推荐使用 tabindex = -1，基本无副作用！ 
} 
</script> 
</body> 
</html>

技术文章快速查找

js简单实现HTML标签Select联动带跳转

javascript Keycode对照表

豆瓣网的jquery代码实例

JavaScript避免代码的重复执行经验技巧分享

addRule在firefox下的兼容写法

jQuery 在光标定位的地方插入文字的插件

javascript 鼠标事件总结

js编码、解码函数介绍及其使用示例

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建