一.写在前面
关于如何获取input框、textarea等的焦点，网上有许多文章都只是会跟你说ng-focus这个内置指令。像这种解答，只能说明作者并为真正理解人家的需求。ng-focus是一个事件，跟原生JS（JavaScript）的onfocus是一样的，当我们点击input框时，就会触发该事件，而在该事件里我们可以调用一个函数。所以，当人家问你如何获取焦点时一般的意思是，如果我进行了某些操作后，不用鼠标点击是如何自动获取焦点，问题的关键是“自动”。
因为AngularJS没有像原生JS那样可通document.getElementById("idVlaue")直接获取元素的功能，所以只能通过自定义指令的方式实现，所以需要实现这个，我们还得有angularjs自定义指令的基础。可参考：http://blog.csdn.net/zcl_love_wx/article/details/51331539
二.代码示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div ng-app="myApp" ng-controller="control">
<input type="text" set-Focus ng-blur="setBlur()">
<button ng-click="getFocus()">孙爷爷我要去取芭蕉扇了</button>
</div>
<script src="jquery-1.8.3.js"></script>
<script src="angular1.2.9.js"></script>
<script type="text/javascript">
//模型
var app = angular.module('myApp',[]);
//控制器
app.controller("control",function($scope){
$scope.isCome = false; //判断大圣来了没
$scope.isFocus = false; //判断是不是要取芭蕉扇
$scope.getFocus = function(){
$scope.isFocus = true; //大圣来了
$scope.isCome = true; //要取芭蕉扇
};
$scope.setBlur = function(){
$scope.isFocus = false;//没人要来取芭蕉扇了
}
});
//自定义指令
app.directive('setFocus',[ function(){
return {
scope:false,
link:function(scope, element){
scope.$watch("isFocus",function(newValue,oldValue, scope) {
//大圣来了，且要取芭蕉扇
if(newValue && scope.isCome){
element[0].focus(); //获取焦点
alert("猴哥")
}
}, true);;
}
};
}]);
</script>
</html>
三.代码说明
该文默认读者对angualrJS有一定的基础语法，此文的亮点在哪呢？亮点在于实现获取焦点的逻辑。angularjs文档只会告诉你用自定义指令获取焦点，如代码：
<body>
<div ng-app="myApp" >
<input type="text" set-Focus>
</div>
<script type="text/javascript">
var app = angular.module('myApp',[]);
app.directive('setFocus', function(){
return function(scope, element){
element[0].focus();
};
});
</script>
</body>
这块代码，除了能进入页面获取焦点，还能干啥？还能告诉初学者说，亲，自定义指令里面还可以直接return 一个function哟。
正式说说我是如何实现执行一些操作后实现获取焦点的：
首先自定义指令会用不必说了，可亲们是否还知道自定义里有一个属性叫scope啊？在我提供的链接的文章有说明它有两个值类型，boolean和对象，那里面的示例只说了值为对象的例子，但为boolean时没有说过。
既然我们需要在进行某个操作后再获取焦点，那么就需要我们能同时操作自定义指令与控制器里的变量，如第一例子里的isCome和isFocus。
而在scope说明中这样写到：
scope值为false(默认值): 使用父作用域作为自己的作用域。
为true时: 新建一个作用域，该作用域继承父作用域。
所以我们默认就可以直接在自定义指令里操作控制器里的变量。于是我就又用到了监听$watch,这是个什么鬼？后面会写个小文专门解释。只要监听到变化后的结果符合获取焦点的要求，我们就执行element[0].focus();来获取焦点。
文章来源：http://blog.csdn.net/zcl_love_wx/article/details/51382197
相关推荐
关于如何获取input框、textarea等的焦点，网上有许多文章都只是会跟你说ng-focus这个内置指令。像这种解答，只能说明作者并为真正理解人家的需求。ng-focus是一个事件，跟原生JS（JavaScript）的onfocus是一样的，当...
【AI】从头到脚详解如何创建部署Azure Web App的OpenAI项目源码
人脸识别项目实战
人工智能-人脸识别代码，采用cnn的架构识别代码
汽车配件制造业企业信息化整体解决方案
短期风速预测模型，IDBO-BiTCN-BiGRU-Multihead-Attention IDBO是，网上复现 评价指标：R方、MAE、MAPE、RMSE 附带测试数据集运行（风速数据） 提示：在MATLAB2024a上测试正常 ,短期风速预测模型; IDBO-BiTCN-BiGRU-Multihead-Attention; 评价指标: R方、MAE、MAPE、RMSE; 复现; 测试数据集; MATLAB 2024a,短期风速预测模型：IDBO-BiTCN-BiGRU-Attention集成模型
手势识别项目实战
在智慧园区建设的浪潮中，一个集高效、安全、便捷于一体的综合解决方案正逐步成为现代园区管理的标配。这一方案旨在解决传统园区面临的智能化水平低、信息孤岛、管理手段落后等痛点，通过信息化平台与智能硬件的深度融合，为园区带来前所未有的变革。 首先，智慧园区综合解决方案以提升园区整体智能化水平为核心，打破了信息孤岛现象。通过构建统一的智能运营中心（IOC），采用1+N模式，即一个智能运营中心集成多个应用系统，实现了园区内各系统的互联互通与数据共享。IOC运营中心如同园区的“智慧大脑”，利用大数据可视化技术，将园区安防、机电设备运行、车辆通行、人员流动、能源能耗等关键信息实时呈现在拼接巨屏上，管理者可直观掌握园区运行状态，实现科学决策。这种“万物互联”的能力不仅消除了系统间的壁垒，还大幅提升了管理效率，让园区管理更加精细化、智能化。 更令人兴奋的是，该方案融入了诸多前沿科技，让智慧园区充满了未来感。例如，利用AI视频分析技术，智慧园区实现了对人脸、车辆、行为的智能识别与追踪，不仅极大提升了安防水平，还能为园区提供精准的人流分析、车辆管理等增值服务。同时，无人机巡查、巡逻机器人等智能设备的加入，让园区安全无死角，管理更轻松。特别是巡逻机器人，不仅能进行360度地面全天候巡检，还能自主绕障、充电，甚至具备火灾预警、空气质量检测等环境感知能力，成为了园区管理的得力助手。此外，通过构建高精度数字孪生系统，将园区现实场景与数字世界完美融合，管理者可借助VR/AR技术进行远程巡检、设备维护等操作，仿佛置身于一个虚拟与现实交织的智慧世界。 最值得关注的是，智慧园区综合解决方案还带来了显著的经济与社会效益。通过优化园区管理流程，实现降本增效。例如，智能库存管理、及时响应采购需求等举措，大幅减少了库存积压与浪费；而设备自动化与远程监控则降低了维修与人力成本。同时，借助大数据分析技术，园区可精准把握产业趋势，优化招商策略，提高入驻企业满意度与营收水平。此外，智慧园区的低碳节能设计，通过能源分析与精细化管理，实现了能耗的显著降低，为园区可持续发展奠定了坚实基础。总之，这一综合解决方案不仅让园区管理变得更加智慧、高效，更为入驻企业与员工带来了更加舒适、便捷的工作与生活环境，是未来园区建设的必然趋势。
相亲交友系统源码 V10.5支持婚恋相亲、媒婆返利、红娘系统、商城系统等等 这款交友系统功能太多了，适合婚恋相亲，还有媒婆婚庆等等支持 PC和 H5还有小程序，可封装红年、APP，里面带安装教程
本资源《单片机也能玩双核之你想不到的C技巧系列——嵌入式实战》涵盖 双核单片机开发、C语言高级技巧、嵌入式系统优化 等核心内容，结合 实战案例与视频教程，帮助开发者深入理解并掌握高效编程技巧。 适用人群： 适合 嵌入式开发工程师、单片机开发者、电子信息相关专业学生，以及希望提升 C语言编程能力 和 嵌入式项目经验 的技术人员。 能学到什么： 双核单片机开发思路，提高并行处理能力。 C语言高级技巧，提升代码优化与执行效率。 嵌入式系统调试方法，掌握实际项目中的调试策略。 实战案例解析，学习如何在实际工程中应用双核技术。 阅读建议： 建议 先学习基础知识，再结合 示例代码与视频教程 进行实操，重点关注 代码优化、调试技巧与双核应用模式，通过实战演练提高嵌入式开发能力。
人脸识别项目源码实战
人脸识别项目源码实战
c语言学习
红外光伏缺陷目标检测模型，YOLOv8模型 基于红外光伏缺陷目标检测数据集训练，做了必要的数据增强处理，以达到缺陷类别间的平衡 可检测大面积热斑，单一热斑，二极管短路和异常低温四类缺陷 测试集指标如图所示 ,核心关键词：红外光伏缺陷目标检测模型; YOLOv8模型; 数据增强处理; 缺陷类别平衡; 大面积热斑; 单一热斑; 二极管短路; 异常低温。,基于YOLOv8的红外光伏缺陷检测模型
基于PLC的自动浇花控制系统 西门子1200PLC博途仿真，提供HMI画面，接线图，IO分配表，演示视频，简单讲解视频 博图15.1及以上版本均可使用 ,核心关键词： PLC自动浇花控制系统; 西门子1200PLC博途仿真; HMI画面; 接线图; IO分配表; 演示视频; 简单讲解视频; 博图15.1及以上版本。,基于PLC的自动浇花系统：西门子1200PLC博途仿真实践教程
在智慧园区建设的浪潮中，一个集高效、安全、便捷于一体的综合解决方案正逐步成为现代园区管理的标配。这一方案旨在解决传统园区面临的智能化水平低、信息孤岛、管理手段落后等痛点，通过信息化平台与智能硬件的深度融合，为园区带来前所未有的变革。 首先，智慧园区综合解决方案以提升园区整体智能化水平为核心，打破了信息孤岛现象。通过构建统一的智能运营中心（IOC），采用1+N模式，即一个智能运营中心集成多个应用系统，实现了园区内各系统的互联互通与数据共享。IOC运营中心如同园区的“智慧大脑”，利用大数据可视化技术，将园区安防、机电设备运行、车辆通行、人员流动、能源能耗等关键信息实时呈现在拼接巨屏上，管理者可直观掌握园区运行状态，实现科学决策。这种“万物互联”的能力不仅消除了系统间的壁垒，还大幅提升了管理效率，让园区管理更加精细化、智能化。 更令人兴奋的是，该方案融入了诸多前沿科技，让智慧园区充满了未来感。例如，利用AI视频分析技术，智慧园区实现了对人脸、车辆、行为的智能识别与追踪，不仅极大提升了安防水平，还能为园区提供精准的人流分析、车辆管理等增值服务。同时，无人机巡查、巡逻机器人等智能设备的加入，让园区安全无死角，管理更轻松。特别是巡逻机器人，不仅能进行360度地面全天候巡检，还能自主绕障、充电，甚至具备火灾预警、空气质量检测等环境感知能力，成为了园区管理的得力助手。此外，通过构建高精度数字孪生系统，将园区现实场景与数字世界完美融合，管理者可借助VR/AR技术进行远程巡检、设备维护等操作，仿佛置身于一个虚拟与现实交织的智慧世界。 最值得关注的是，智慧园区综合解决方案还带来了显著的经济与社会效益。通过优化园区管理流程，实现降本增效。例如，智能库存管理、及时响应采购需求等举措，大幅减少了库存积压与浪费；而设备自动化与远程监控则降低了维修与人力成本。同时，借助大数据分析技术，园区可精准把握产业趋势，优化招商策略，提高入驻企业满意度与营收水平。此外，智慧园区的低碳节能设计，通过能源分析与精细化管理，实现了能耗的显著降低，为园区可持续发展奠定了坚实基础。总之，这一综合解决方案不仅让园区管理变得更加智慧、高效，更为入驻企业与员工带来了更加舒适、便捷的工作与生活环境，是未来园区建设的必然趋势。
大型集团用户画像系统化标准化数字化用户主数据管理项目规划方案
基于STM32的水质 浊度检测仪设计与实现（详细设计说明书+ 10008-基于STM32的水质 浊度检测仪设计与实现（详细设计说明书+原理图PCB工程+源码工程+实物照片） 本次设计是设计一款水质检测设备，实现温度检查、水质检测的功能，将检测到的数据显示到显示器中，并实时记录系统的参数 本次系统需要对温度检测，使用的传感器为DS18B20，通过单总线的方式来完成系统温度检测 使用水质检测模块检查水的质量 通过传感器检测到的数据计算后的值实时刷新到显示器中，主要的功能包括以下几点： ①可以对温度实时检测； ②可以对水质实际值实时检测； ③水质浑浊预警 主要特点： 1．以STM32单片机为核心，配合水质模块； 2．主要完成系统的 功能控制、状态显示、信息检测以及报警硬件组建所单片机和传感器等元器件的选择； 3．完成系统控制的软件设计编程； 4．实现对水质检测、温度检查、预警的功能 内容包含： 1、原理图工程 2、PCB工程 3、源码工程 4、实物照片 5、详细介绍说明书-22531字 6、实物照片 7、浊度传感器资料
人脸识别项目实战