2017-11-01 48 views
0

stackoverflowers. 문자로 입력 텍스트를 캡처해야하는 자동 완성 응용 프로그램에서 작업하고 있으며 현재 jquery로 "입력"이벤트를 듣고 있습니다. 함수가 다음과 같이 전체 입력 값으로 트리거되기 때문에Jquery 입력 한 것처럼 텍스트 붙여 넣기

내가 직면 해요 문제는 붙여 넣은 텍스트입니다 :

붙여 값은 =,

input.val() = "demo" 

을 "데모"하지만 제가 달성하고자하면있어 같이 4 회에 실제로 입력 된 것처럼 붙여 그 값을 분해하고, 기능을 트리거하는 것이다

붙여 값 =

을 "데모"

바닐라 JS 또는 Jquery로이 문제를 해결하는 방법에 대한 조언이나 지침을 알려 주실 수 있습니까?

미리 감사드립니다.

답변

1

시도 다음과 같은 방법 :

<input type="text"> 
<div></div> 

<script> 
    var myInput = $("input"); 
    var value = ''; //to store previous input value 

    myInput.on('input', function() { 
    var current = myInput.val(); 
    var dif = current.replace(value, ''); 
    if(dif.length) { 
     var out = value; 
     for(var i = 0; i < dif.length; i++) { 
     out += dif.substr(i, 1); 
     output(out); 
     } 
    } 
    value = current; 
    }); 

    function output(text) { 
    console.log(text); 
    $("div").text(text); 
    // here you can even to re-set input value via myInput.val 
    } 
</script> 

하면, 입력 "1"을 "345"을 "2"를 시도하고 당신이 "1"을 얻을 것이다, "12", "123", "1234", " 12345 "를 콘솔 로그에 기록합니다.

이 방법은 텍스트를 입력 끝에 추가 할 때만 작동합니다. 입력 끝까지 텍스트를 삽입해야하는 경우 절차를 업데이트해야합니다.

도 참조하십시오. Plunker.

+0

나는 이미 사용하고 있지만 oninput이 트리거되기 전에 붙여 넣은 텍스트를 캡처해야합니다. 현재 onpaste 이벤트의 기본 동작을 방지하여이를 해결하려고하므로 oninput 트리거와 구분할 수 있습니다. – moy2010

+0

@ moy2010 답변을 업데이트하고 해결책 초안을 제공했습니다. 모든 사례를 다루는 것은 아니지만 그 아이디어는 충분히 분명해야합니다. 'output' 메쏘드는 어떻게 추가되는지 (하나씩 또는 그룹으로)에 관계없이 입력의 각 심볼마다 호출됩니다. – dhilt

+0

도움 주셔서 감사합니다, dhilt! for 루프에 의해 반환 된 "out"변수는 실제로 원했던 것이지만 어떤 이유로 typeWatch 플러그인이 입력 필드 값의 변경을 인식하지 못합니다 (필드 값을 "out"의 내용으로 채 웁니다). . 나는 샘플 코드에서 계속 노력하고 학습해야 할 것입니다. 멋진 주말 보내십시오. – moy2010

0

화면에 표시하기 전에 입력 길이를 확인할 수 있다고 생각합니다.