个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在捕获这样的按键:
<div class="contentView"
ng-keypress="phs.keyEnter($event)">
keyEnter = ($event): void => {
var a = $event;
如何才能让单击某个键使光标转到输入字段:
<input ng-change="phs.englishChange();"
ng-model="phs.english"
ng-model-options="{ debounce: 750 }"
style="width:6rem;"
type="text" />
最佳答案
我认为 directive 可以帮助我们为您的问题提供更通用和可重用的解决方案，因为它是将指定行为附加到该 input 元素的最佳位置。因此，这里是一个自定义 doOnKeypress 指令，它接受一个键 (doOnKeypress) 和一个可选回调 (acceptOn) 来检查触发的 keypress event 的目标以及一个回调 (onKeypress)，如果满足所有条件，该回调将被触发。
在下面的示例中，只要按下 a 键盘按钮，input 就会获得焦点。我留下了评论，以便您可以根据需要进行修改(希望总体思路清晰):
angular.module("app", [])
.controller("TestController", ["$scope", function ($scope) {
$scope.acceptOn = function (target, element) {
console.log(target); // you can make any checks for target by passing this into a directive
return element[0] !== target[0]; //target is not the same input element
};
$scope.focusOn = function (element) {
element[0].focus(); // or whatever you want with element
};
}]).directive('doOnKeypress', ['$document', function ($document) {
return {
restrict: 'A',
scope: {
doOnKeypress: '@',
acceptOn: '&?',
onKeypress: '&'
},
link: function postLink(scope, element) {
function keypress(e) {
var target = angular.element(e.target);
var targetIsAcceptable = angular.isFunction(scope.acceptOn) ? scope.acceptOn({
target: target,
element: element
}) : true; // add the condition to test the target
var specialKeyPressed = e.shiftKey || e.ctrlKey || e.altKey || e.metaKey; // in case you need to check any special keys
if (targetIsAcceptable && !specialKeyPressed) {
var keyCode = e.which || e.keyCode;
var key = String.fromCharCode(keyCode);
if ("*" === scope.doOnKeypress || key.toLowerCase() === scope.doOnKeypress.toLowerCase()) { // any check before focusing (lets say * - is any key)
e.preventDefault(); // prevent from typing into the input
scope.onKeypress({element: element});
}
}
}
$document.on('keypress', keypress);
scope.$on('$destroy', function () {
$document.off('keypress', keypress);
});
}
};
}]);<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.min.js"></script>
<body ng-app="app" class="">
<div ng-controller="TestController" class='listen-to-keypress'>
TestController
<br/>
<div>
<input ng-change="phs.englishChange();"
ng-model="phs.english"
ng-model-options="{ debounce: 750 }"
style="width:6rem;"
do-on-keypress='A'
accept-on='acceptOn(target, element)'
on-keypress='focusOn(element)'
type="text" />
</div>
</div>
</body>更新:在 acceptOn 回调中添加了 element 参数，以允许将目标与相同元素进行比较，因为我们想让用户在我们的例子中，输入这个 input 元素。
关于angularjs - 如何根据按键将光标定位在输入字段中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48483914/
25
4
0
我对 JavaScript 上的 onkeypress 事件有疑问。 是否可以仅检测 Cntl 键或 Alt 键？此时，如果同时按下 Cntl 和 m，则 onkeypress 事件可以触发单击。是否
我想知道按键中允许使用什么样的字符。它是否也生成一个符号下划线(_)？我总是得到一个带有 - 字母的按键。 最佳答案 按键使用修改过的 Base64 字母表: -0123456789ABCDEFGHI
我有以下格式的（格式错误的DITA）XML： BLARG BLARG Definition BLARG2 BLARG2 Definition BLARG3 BLARG3 Definition
我有两个单独的对象数组，如果特定键值匹配，我需要将它们合并。分析数据后可能更有意义: 数组 1 let categories = [ { id: 5, slug: 'category-5',
由于我是新手，所以我的低效编码给大家带来了巨大的麻烦，对此我提前表示歉意。 我正在尝试在 HTML5 Canvas 上使用 Javascript 制作一个非常基本的游戏，但我似乎找不到一种简单的方法来
我试图找出将多维数组中的对象 id 属性映射到共享相同 id 的另一个数组中的对象值的最佳方法。 举个例子，我有一个像这样的genre_ids数组: 0: {id: 1, name: 'sci-fi'
我有一个游戏，当按下一个键时，您可以通过将子弹添加到 Controller 类来发射子弹。这是代码来自 KeyPressed(); else if (key == KeyEvent.VK_Q && !
我想比较两个字典的长度以及每个字典中每个键、值对的长度。如果在查找时没有匹配项，我还需要能够打印出来。 我当前的代码似乎传递了长度标准，但在尝试匹配元素时失败: assert_that(len(mod
我正在寻找一种跨平台(Win 和 MacOS)方法来检测 C# 中 OpenGL 应用程序的按键。 以下有效，但仅适用于字母数字字符。 protected override void OnKeyPre
我正在 try catch 按键事件(向上和向下翻页)，但根本没有收到任何按键事件。这是相关代码:构造函数: private MainLayout() { imageView = new Im
$(el).bind('blur keypress', function(event){ if(event.type == 'keypress' && event.keyCode != 13) r
我有这段代码: while (SDL_PollEvent(&event)) { if (event.type == SDL_KEYDOWN) { switch(event.key.keys
我正在使用下面的代码: $(document).keypress(function (e) { if (e.which === 68 || e.which === 100) {
我正在用 html 和 javascript 制作游戏。只是为了澄清，这不是重复或任何东西。没有什么可以给我我需要的答案。另外，在解释之前，我想说我对按键监听器没有任何问题，我的游戏知道何时按下按键以
我正在尝试用 Javascript 制作游戏，但目前我已经陷入停滞。我正在尝试检测按键并检查它们是否不断按下以移动 Angular 色。这是我正在使用的代码: var THREE; var keys;
我得到了多维数组。我想从每个子数组中删除/取消设置索引为 1 的值。我的数组 $data。 Array ( [3463] => Array ( [0]
我正在设计一个基于网络的会计软件。例如，每当用户按 N 键时，我想打开“新会计凭证”。并在他/她按下 S 键时打开“设置”。 我看到了一些基于 JavaScript 和 jQuery 的脚本。但它们并
阅读此主题后: Keypress events stopped working outside of "input" elements in Meteor after update to 0.5.2
所以，当我按下按钮 1“1 PLAY/STOP”时，按钮变成绿色，当我再次按下它时它会去除颜色。 如果我按下 button2“2 PLAY/STOP”，同样的事情会发生。 如果两个按钮之一播放而我按下
非常直接的问题。 只想按一个键盘键。像输入一样，使用 pywin auto。我不想在任何应用程序窗口的上下文中按下它。 只是键盘键的原始按键，如 a 或 enter 或退格。 最佳答案 只需使用 #
我是一名优秀的程序员,十分优秀！