2017-08-01 22 views
5

選擇文本我有一個input元素,它通過使用NG-模型裏面的文字,然後我試圖通過創建自定義的偵探選擇所有文字:在元素

.directive('selectText', function() { 
    return { 
     require: 'ngModel', 
     link: function(scope, elem, attrs, ctrl) { 
      elem.bind('focus', function() { 
       $(elem).select(); 
      }); 
      scope.$watch("edit",function(newValue,oldValue) { 
       $(elem).select(); 
      }); 
     } 
    }; 
}) 

它運作良好,但我不希望當用戶foucusout從控制檯和focusin再次選擇文本。它應該只選擇一次文本(而不是第二個焦點)。 另外,如何在選擇全部文本後從元素中移除焦點?

+0

您是否想在選擇全部文本後立即選擇focousout?或者是其他東西? – anu

回答

0

如果選擇元素,則可以創建將保存布爾值的變量,並且只有在尚未選擇元素時才選擇元素。就像這樣:

.directive('selectText', function() { 
    return { 
     require: 'ngModel', 
     link: function(scope, elem, attrs, ctrl) { 
      var selected = false; 
      elem.bind('focus', function() { 
       if (!selected) { 
        $(elem).select(); 
        selected = true; 
       } 
      }); 
      scope.$watch("edit",function(newValue,oldValue) { 
       $(elem).select(); 
      }); 
     } 
    }; 
}) 
+0

有沒有像'加載','顯示'等事件? – Ted

0

function Ctrl3($scope) { 
 
    $scope.title = 'My relevant title'; 
 
} 
 

 
angular.module('scopePropertiesModule', []) 
 
    .directive('selectText', function() { 
 
    return { 
 
     require: 'ngModel', 
 
     link: function(scope, elem, attrs, ctrl) { 
 
     var counter = 0; 
 
     elem.bind('focus', function() { 
 
      console.log(counter) 
 

 
      if (counter < 1) { 
 
      $(elem).select(); 
 
      /*setTimeout(function() { 
 
       $(elem).blur(); 
 
      }, 1000);*/ 
 
      
 
      counter++; 
 
      } 
 
     }); 
 
     scope.$watch("edit", function(newValue, oldValue) { 
 
      $(elem).select(); 
 
     }); 
 
     } 
 
    }; 
 
    })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
 
<div ng-app="scopePropertiesModule"> 
 
    <div ng-controller="Ctrl3"> 
 
    <input select-text ng-model="title"> 
 
    </div> 
 
</div>

檢查。