Question

我在html中限制了一个文本字段。这样就开发了一个指令，只允许数字甚至复制和粘贴也有限制。但是在复制和粘贴数字时我遇到了一些问题，即使不允许。 ctrl + v中的最后一个keyup是v那就是为什么不允许。我在代码下面使用。我想要一些基于条件的字母，这就是为什么我使用type =“text”。

enter link description here

<input type="text" min="0" name="inputName" ng-model="myModel" dl-enter-Num="closeModalWindow();" >

app.directive('dlEnterNum', function() {
    return function($scope, element, attrs) {
        element.bind("keydown keypress paste", function(event) {
            var keyCode = event.which || event.keyCode;
            if($scope.documentTypeNumber==1 || $scope.documentTypeNumber ==2){
                var keys={
                        'up': 38,'right':39,'down':40,'left':37,'space':8,'ctrl':17,
                        'escape':27,'tab':9,'enter':13,'del':46,
                        '0':48,'1':49,'2':50,'3':51,'4':52,'5':53,'6':54,'7':55,'8':56,'9':57
                    };
                    for(var index in keys) {
                        if (!keys.hasOwnProperty(index)) continue;
                        if (event.charCode==keys[index]||keyCode==keys[index]) {
                            if(keyCode==39 || keyCode==46 || keyCode==38 || keyCode==37 || keyCode==40 || keyCode==64){

                            }else{
                            return; //default event
                            }
                        }
                    }   
                    event.preventDefault();
            }else if($scope.documentTypeNumber==6){
                if (event.shiftKey && event.keyCode < 65 && event.keyCode > 90) {
                    event.preventDefault();
                }
                if (event.keyCode == 46 ||  (event.keyCode>90 && event.keyCode<97)) {
                    event.preventDefault();
                }
                else {
                    if (event.keyCode < 65) {
                        if ((event.keyCode != 32 && event.keyCode < 44) || event.keyCode > 57 || event.keyCode ==46 || event.keyCode ==47) {
                            event.preventDefault();
                        }
                    }
                    else {
                        if (event.keyCode < 65 || event.keyCode > 122) {
                            event.preventDefault();
                        }
                    }
                }
            }
        });
    };
});

Answer 1

这是你能做的最好的事情

.directive("dlEnterNum", ["$timeout", function ($timeout) {
    return {
        restrict: "A",
        scope: false,
        link: function (scope, element) {
            var ctrlDown = false,
                ctrlKey = 17,
                cmdKey = 91,
                vKey = 86,
                cKey = 67;

            $(document).off("keydown.enterNum").on("keydown.enterNum", function (e) {
                if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = true;
            }).off("keyup.enterNum").on("keyup.enterNum", function (e) {
                if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = false;
            });

            var pasting = function (keyCode) {
                return ctrlDown && (keyCode == vKey || keyCode == cKey);
            };

            var isDigit = function (keyCode) {
                return (keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105);
            };

            var noCharKeys = {
                up: 38,
                right: 39,
                down: 40,
                left: 37,
                backspace: 8,
                space: 32,
                escape: 27,
                tab: 9,
                enter: 13,
                del: 46
            };

            element.on("keydown", function (event) {
                var keyCode = event.which || event.keyCode;
                console.info("DOCUMENT TYPE: " + scope.documentTypeNumber);
                console.info("KEY CODE: " + keyCode);
                switch (scope.documentTypeNumber) {
                    case 1:
                    case 2:
                    {
                        //CHECK IF ALL DIGITS AFTER PASTE
                        if (pasting(keyCode)) {

                            $timeout(function () {
                                var isNumeric = /^\d+$/.test(scope.myModel);
                                if (!isNumeric) {
                                    scope.myModel = "";
                                }
                            });

                            return true;
                        }

                        //CHECK FOR DIGITS INPUT
                        if (!isDigit(keyCode)) {
                            event.preventDefault();
                        }

                        break;

                    }
                    case 6:
                    {
                        if (pasting(keyCode)) {

                            $timeout(function () {
                                var isAlphabetic = /^[A-Za-z]+$/.test(scope.myModel);
                                if (!isAlphabetic) {
                                    scope.myModel = "";
                                }
                            });

                            return true;
                        }

                        //CHECK FOR DIGITS INPUT
                        if (isDigit(keyCode)) {
                            event.preventDefault();
                        }

                        break;
                    }
                } //SWITCH CLOSING BRACKET

                //CHECK FOR OTHER KEYS
                for (var key in noCharKeys) {
                    if (event.charCode == noCharKeys[key] || keyCode == noCharKeys[key]) {
                        event.preventDefault();
                    }
                }

            });
        }
    };
}]);

EDIT-1 13/06：

工作小提琴==＆gt; https://jsfiddle.net/tonysamperi/gbzu9d8r/

event.keyCode使用angular指令不起作用。？

1 个答案: