我想通过angularjs指令(或其他方式)禁用数字输入的向上和向下键 注意:我不想将输入类型更改为文本,因为我被要求不这样做。 我也已经拆掉了纺纱机。 我是棱角分明的人,所以不太了解它。我搜索了我能找到的所有链接,但他们主要是关于隐藏旋转器而不是禁用箭头键。 我从其他链接获得此代码。这会禁用鼠标滚轮。如果可以对此进行一些更改,那就太棒了。
module.directive('input',function() {
return {
restrict: 'E',
scope: {
type: '@'
},
link : function (scope, $element) {
if (scope.type == 'number') {
$element.on('focus', function () {
angular.element(this).on('keyup', function (e) {
e.preventDefault();
});
});
$element.on('blur', function () {
angular.element(this).off('keyup');
});
}
}
}
});
答案 0 :(得分:5)
如果要为所有输入[数字]元素全局禁用向上/向下箭头键:
$(document).bind('keydown', function(event) {
var target = event.srcElement || event.target;
var tag = target.tagName.toUpperCase();
var type = target.type.toUpperCase();
if (tag === 'INPUT' && type === 'NUMBER' &&
(event.keyCode === 38 || event.keyCode === 40)) {
event.preventDefault();
}
});
或者您可以使用指令将其绑定到单个元素:
.directive('disableArrows', function() {
function disableArrows(event) {
if (event.keyCode === 38 || event.keyCode === 40) {
event.preventDefault();
}
}
return {
link: function(scope, element, attrs) {
element.on('keydown', disableArrows);
}
};
});
模板:
<input type="number" disable-arrows />
答案 1 :(得分:1)
您可以将指令更改为:
module.directive('input',function() {
return {
restrict: 'E',
scope: {
type: '@'
},
link : function (scope, $element) {
if (scope.type == 'number') {
$element.on('focus', function () {
angular.element(this).on('keyup', function (e) {
if (event.keyCode === 38 || event.keyCode === 40) {
e.preventDefault();
}
});
});
$element.on('blur', function () {
angular.element(this).off('keyup');
});
}
}
}
});