텍스트가 텍스트 상자의 너비보다 긴 경우 처음부터 텍스트 표시

일부 텍스트가 입력 필드에 추가되고 텍스트가 너비를 초과하는 경우. 이제 포커스가 입력 필드 밖으로 이동하면 (흐리게 표시됨) 사용자가 입력을 중단 한 곳이 아닌 처음부터 텍스트를 표시하려고합니다.텍스트가 텍스트 상자의 너비보다 긴 경우 처음부터 텍스트 표시

크롬에서는 기본적으로 작동합니다. 즉 입력 필드에서 포커스가 사라지면 Chrome은 자동으로 커서를 텍스트의 시작 부분으로 이동시킵니다.

Mozilla, EDGE, IE에서는이 동작이 작동하지 않습니다.

출처

2016-08-12 Daksh Chandegra

매우 간단합니다.

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

 
app.directive("fixCursorFoo", function() { 
 
    return { 
 
     restrict: 'A', 
 
     link: function ($scope, $element) { 
 
      $element.on("blur", function() { 
 
       var inp = $element[0]; 
 
       if (inp.createTextRange) { 
 
        var part = inp.createTextRange(); 
 
        part.move("character", 0); 
 
        part.select(); 
 
       } else if (inp.setSelectionRange) { 
 
        inp.setSelectionRange(0, 0); 
 
       } 
 
      }) 
 
     } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 

 
<div ng-app="sa"> 
 
    <input type="text" fix-cursor-foo class="form-control" /> 
 
</div>

모질라에이 예제를 move cursor to the beginning of the input field?

실행 : 지시어를 만들고에서 답을 사용

출처

2016-08-12 07:10:59

텍스트가 텍스트 상자의 너비보다 긴 경우 처음부터 텍스트 표시

답변

관련 문제