> 웹 프론트엔드 > HTML 튜토리얼 > div无法触发blur事件解决办法_html/css_WEB-ITnose

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

WBOY
풀어 주다: 2016-06-24 11:53:57
원래의
1399명이 탐색했습니다.

默认情况下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>
로그인 후 복사


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

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



원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿