jQuery Blur() 이벤트 사용 방법에 대한 자세한 설명
- 黄舟원래의
- 2017-06-26 14:04:533135검색
개요
일치하는 각 요소에 대해 흐림이벤트를 트리거합니다.
이 함수는 브라우저의 기본 동작을 포함하여 흐림 이벤트에 바인딩된 모든 함수를 호출하고 실행합니다. false를 반환하면 브라우저의 기본 동작이 실행되는 것을 방지할 수 있습니다. 요소가 포커스를 잃으면 흐림 이벤트가 트리거됩니다. 이는 마우스 동작 또는 일치하는 각 요소의 흐림 이벤트에 핸들러 함수를 바인딩하는
parameter
fnFunctionV1.0
일 수 있습니다.
[data],fnString,FunctionV1.4.3
data:blur([Data], fn)는 함수 fn이 처리할 데이터를 전달할 수 있습니다.
fn: 일치하는 각 요소의 흐림 이벤트에 바인딩된 핸들러 함수입니다.
Example
Description:
모든 문단의 흐림 이벤트를 트리거합니다.
jQuery Code:
$("p").blur();Description:
한 문단이 초점을 잃으면 "Hello World!"가 팝업되고 흐림 이벤트에 연결됩니다. 일치하는 각 요소의 특정 처리 기능.
jQuery 코드:
$("p").blur( function () { alert("Hello World!"); } );Example
포커스를 잃을 때 입력 필드의 색상 변경(흐림):
$("input").blur(function(){
$("input").css("background-color","#D6D6FF");
});<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function(){
$("input").css("background-color","#FFFFCC");
});
$("input").blur(function(){
$("input").css("background-color","#D6D6FF");
});
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
</body>
</html>정의 및 사용법 흐림 이벤트는 요소가 초점을 잃을 때 발생합니다. Blur() 함수는 흐림 이벤트를 트리거하거나, 함수 매개변수가 설정된 경우 흐림 이벤트가 발생할 때 실행될 코드를 함수에서 지정할 수도 있습니다. 팁: 이전에는 흐림 이벤트가 양식 요소에서만 발생했습니다. 새 브라우저에서는 이 이벤트를 모든 요소에서 사용할 수 있습니다
触发 blur 事件触发被选元素的 blur 事件。语法$(selector).blur()<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").focus(function(){
$("input").css("background-color","#FFFFCC");
});
$("input").blur(function(){
$("input").css("background-color","#D6D6FF");
});
$("#btn1").click(function(){
$("input").focus();
});
$("#btn2").click(function(){
$("input").blur();
});
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
<p><button id="btn1">触发输入域的 focus 事件</button></p>
<p><button id="btn2">触发输入域的 blur 事件</button></p>
</body>
</html>위 내용은 jQuery Blur() 이벤트 사용 방법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!