以下是一个简单的jQuery示例,用于处理文本框的获得焦点(focus)和失去焦点(blur)事件。这个示例会在文本框获得焦点时显示一条消息,并在失去焦点时隐藏该消息。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery Textbox Focus and Blur Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
// 当文本框获得焦点时
$("#myTextbox").focus(function(){
$("#message").show().text("文本框已获得焦点");
});
// 当文本框失去焦点时
$("#myTextbox").blur(function(){
$("#message").hide();
});
});
</script>
</head>
<body>
<input type="text" id="myTextbox" placeholder="点击我">
<div id="message" style="display:none; margin-top:10px;">消息将在这里显示</div>
</body>
</html>
在这个示例中,我们首先引入了jQuery库。在`