Heim > Web-Frontend > HTML-Tutorial > div无法触发blur事件解决办法_html/css_WEB-ITnose

div无法触发blur事件解决办法_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Freigeben: 2016-06-24 11:53:57
Original
1425 Leute haben es durchsucht

默认情况下div无法获取焦点,无法触发focus与blur事件,猜测span,a等标签也无法触发焦点事件(input:button,及button标签可以触发)

如何使div触发blur事件:可以给div加上tabindex属性

在线演示:http://sandbox.runjs.cn/show/e0bvfcag

源码:

	<meta charset="UTF-8">	<title>Document</title>	<style>		.box{			width: 200px;			height: 200px;			background-color: #3295F2;		}	</style>  <script type="text/javascript" src="http://sandbox.runjs.cn/uploads/rs/294/c4c2o6mh/jquery.js"></script>	<input type="text">	<input type="button" value="测试" class="but">	<button>kkk</button>	<div class="box" tabindex="1"></div>	<script>		$('.box').focus(function(){			alert('div focus');		});		$('.box').blur(function(){			alert('div blur');		});		$('.but').focus(function(){			alert('but');		});		$('.but').blur(function(){			alert('but');		});		$('button').focus(function(){			alert('but');		});		$('button').blur(function(){			alert('but');		});	</script>
Nach dem Login kopieren


相关资料: http://www.w3school.com.cn/tags/att_standard_tabindex.asp

demo:  http://www.w3school.com.cn/tiy/t.asp?f=html_standard_tabindex



Verwandte Etiketten:
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage