textarea中不可編輯的結尾文字

Question

我一直與此戰鬥了幾天無濟於事。

我需要一個帶有不可編輯文本結尾的文本區。

下面是文本區域開始處的文本小提琴，要求將它放在最後。任何人有任何見解如何實現這一目標？

http://jsfiddle.net/codemonkeytony/3ew5h6bf/7/

var partialApp = angular.module("partialApp", []); 

partialApp.directive('partialReadonly', function() { 
return { 
    restrict: 'A', 
    link: function (scope, elem, attrs) { 
     elem.on('keypress, keydown', function (event) { 
      console.log(scope.bbb); 
      console.log(event); 
      var readOnlyLength = attrs["partialReadonly"].length; 
      if ((event.which != 37 && (event.which != 39)) && ((elem[0].selectionStart < (scope.bbb - readOnlyLength)) || ((elem[0].selectionStart != (scope.bbb - readOnlyLength)) && (event.which == 8)))) { 
       event.preventDefault(); 
      } 
     }); 
     $(window).load(function() { 
       elem[0].value = attrs["partialReadonly"]; 
      }); 
     } 
    }; 
}); 

Answer 1

我已經更新的按鍵事件處理的邏輯。如果您想要這種行爲，請檢查此更新的fiddle。

partialApp.directive('partialReadonly', function() { 
return { 
    restrict: 'A', 
    link: function (scope, elem, attrs) { 
     var readOnlyText = attrs["partialReadonly"]; 
     var readOnlyLength = readOnlyText.length; 
     var ele = elem[0]; 
     elem.on('keypress, keydown', function (event) { 
      var actualTextLength = ele.value.length - readOnlyLength; 
      var readOnlyTextStartIndex = actualTextLength; 
      if (elem[0].selectionStart > readOnlyTextStartIndex) { 
       event.preventDefault(); 
      } 
     }); 
     $(window).load(function() { 
      elem[0].value = attrs["partialReadonly"]; 
     }); 
    } 
}; 
});