首页 > 代码库 > :focus匹配当前获取焦点的元素(小示例)
:focus匹配当前获取焦点的元素(小示例)
源代码
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <script src="http://code.jquery.com/jquery-latest.js"></script> 5 </head> 6 <body>
7 <style> 8 .focused { 9 background:#C93;10 }11 </style>
12 <div id="content">13 <input tabIndex="1">14 <input tabIndex="2">15 <select tabIndex="3">16 <option>select menu</option>17 </select>18 <div tabIndex="4">19 a div20 </div>21 </div>22 23 <script>24 $( "#content" ).delegate( "*", "focus blur", function( event ) { /*为content的子元素添加“focus blur”事件*/25 var elem = $( this ); /*获取当前所有元素并赋值到elem*/26 setTimeout(function() { /*执行setTimeout函数*/27 elem.toggleClass( "focused", elem.is( ":focus" ) ); /*设置被选元素的类进行切换 elem.is判断当前是否获取焦点。如果没有,则获取焦点*/28 }, 0);29 });30 </script>31 32 </body>33 </html>
:focus匹配当前获取焦点的元素(小示例)
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。