JS事件光标聚焦事件（onfocus）当网页中的对象获得聚点时，执行onfocus调用的程序就会被执行

光标聚焦事件详解

最新推荐文章于 2024-03-16 11:36:04 发布

原创最新推荐文章于 2024-03-16 11:36:04 发布 · 1.1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #web前端

JavaScript进阶篇专栏收录该内容

91 篇文章

订阅专栏

本文介绍了HTML中的光标聚焦事件（onfocus），并通过一个实例展示了如何使用该事件来触发JavaScript函数，实现当用户将焦点移至下拉列表时显示提示信息。

光标聚焦事件（onfocus）

当网页中的对象获得聚点时，执行onfocus调用的程序就会被执行。

如下代码, 当将光标移到文本框内时，即焦点在文本框内，触发onfocus 事件，并调用函数message()。

运行结果：

任务

补充右边编辑器第14行，当下拉列表得到焦点时，调用message()函数，就弹出对话框“"请选择，您现在的职业！”。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> 光标聚焦事件 </title>
  <script type="text/javascript">
    function message(){
	  alert("请选择，您现在的职业！");
	}
  </script>
</head>
<body>
请选择您的职业：<br>
  <form>
    <select name="career" onfocus="message()"> 
      <option>学生</option> 
      <option>教师</option> 
      <option>工程师</option> 
      <option>演员</option> 
      <option>会计</option> 
    </select> 
  </form>
</body>
</html>