资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
JavaScript 关于元素获取焦点(隐藏元素与div)
1，隐藏元素无法获取焦点
2，对于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="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获取焦点"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Afunction%20process0()%7B%20%0D%0Avar%20textbox%20%3D%20document.getElementById(%22textbox%22)%3B%20%0D%0Atextbox.onfocus%20%3D%20function()%7Balert('%E8%8E%B7%E5%8F%96%E7%84%A6%E7%82%B9')%3B%7D%20%0D%0Atextbox.focus()%3B%20%0D%0A%7D%20%0D%0Afunction%20process1()%7B%20%0D%0Avar%20a%20%3D%20document.getElementById(%22a%22)%3B%20%0D%0Aa.onfocus%20%3D%20function()%7Balert('%E8%8E%B7%E5%8F%96%E7%84%A6%E7%82%B9')%3B%7D%20%0D%0Aa.focus()%3B%20%0D%0A%7D%20%0D%0Afunction%20process2()%7B%20%0D%0Avar%20b%20%3D%20document.getElementById(%22b%22)%3B%20%0D%0Ab.onfocus%20%3D%20function()%7Balert('%E8%8E%B7%E5%8F%96%E7%84%A6%E7%82%B9')%3B%7D%20%0D%0Ab.focus()%3B%20%0D%0A%2F%2F%E9%9D%9E%E5%B8%B8%E6%8E%A8%E8%8D%90%E4%BD%BF%E7%94%A8%20tabindex%20%3D%20-1%EF%BC%8C%E5%9F%BA%E6%9C%AC%E6%97%A0%E5%89%AF%E4%BD%9C%E7%94%A8%EF%BC%81%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程