Javascript 使用AngularJS中的ui按键将焦点更改为下一个输入
我在输入字段中使用ui keypress指令应用函数newline(),该函数在当前(聚焦)输入字段下创建一个新的输入字段。它工作正常,但我想更新这个函数,以便焦点跳到新创建的字段 这是我的index.html:Javascript 使用AngularJS中的ui按键将焦点更改为下一个输入,javascript,angularjs,Javascript,Angularjs,我在输入字段中使用ui keypress指令应用函数newline(),该函数在当前(聚焦)输入字段下创建一个新的输入字段。它工作正常,但我想更新这个函数,以便焦点跳到新创建的字段 这是我的index.html: <!doctype html> <html ng-app="myApp"> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2
<!doctype html>
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.min.js">
</script>
<script src="script.js"></script>
<script src="keypress.js"></script>
</head>
<body ng-controller="TextCtrl">
<div ng-repeat="task in tasks track by $index">
<input type="text" class="form-control" ng-model="task.text" ui-keypress="{13:'newline($index+1)'}" >
</div>
</body>
</html>
你能试试这个吗
.directive('focusOnLoad', function () {
return {
restrict: 'E',
link: function (scope, element, attrs) {
$timeout(function() {
element.find('input').focus()
},0);
}
}
}
关于HTML-do
在控制器中,只需添加新任务
focus
方法从何而来?你的tasks
是一个普通对象。我刚在谷歌上搜索了js focus,找到了.focus()。我认为这是一种内置功能。您可以自由删除该行。@Chandermani我的问题是如何修改newline()方法,它不仅通过向任务数组添加新的空任务来创建新的输入字段,而且还将焦点更改为新的输入字段。我在函数中添加了最后一行作为占位符:)可能会导致某种解决方案。删除该行是为了避免误导我尝试了你的建议,但没有效果。请检查一下这个plukr。ps keypress.js是从这里下载的,工作正常。@AlexBuduguru我已经修复了小提琴,以表明这是一个需要调整的想法。比以前更好,但现在焦点总是转到最后一个输入。我需要新创建的输入(不一定在底部)处于焦点位置。按enter键时,新输入字段将显示在当前关注的输入字段下方。顺便问一下,我在哪里可以阅读有关此问题的更多信息以及您是如何找到解决方案的?你能给我一些文章等的链接吗?这里没有什么神奇的东西,只要指令被创建,它就会得到关注。最后一个被创造出来的得到关注。据我所知,现在您正在将元素添加到数组的开头,这种方式可能不起作用。这是标准jquery
.directive('focusOnLoad', function () {
return {
restrict: 'E',
link: function (scope, element, attrs) {
$timeout(function() {
element.find('input').focus()
},0);
}
}
}