event.preventdefault is not working in firefox

Question

I am trying to make the partial text in Input filed as read only, to achieve that I found this code but it is not working in FIrefox, works fine in chrome.

Found that event.preventDefault is causing the problem. Tried return false, that is also not working.

Angular JS Directive code

app.directive('partialReadonly', function () {
    return {
        restrict: 'A',
        link: function ($scope, $element, attrs) {

            $element.on('keypress, keydown', function (event) {
                var readOnlyLength = attrs["partialReadonly"].length;

                if ((event.which != 37 && (event.which != 39))
                        && (($element[0].selectionStart < readOnlyLength)
                                || (($element[0].selectionStart == readOnlyLength) && (event.which == 8)))) {
                    alert('preventdef');
                    //return false;
                    event.preventDefault();
                }
            });

            $scope.load = function () {
                alert('load called attrs["partialReadonly"] ' + attrs["partialReadonly"]);
                $scope.temp = attrs["partialReadonly"];
                // $element[0].value = attrs["partialReadonly"];

            };

        }
    };
});

Html code

 <input type="text"  ng-init="load()" ng-model="key" partial-readonly="{{number}}" />

Answer 1

As @epascarello and @Alon don't use alert for debugging instead use console logs, Removing alert from your script might help.

Hope i helped