복붙노트

[JQUERY] 캐치 페이스트 입력

JQUERY

캐치 페이스트 입력

해결법


  1. 1.OK, 그냥 같은 문제에 부딪쳤다 .. 나는 먼 길을 주위에 갔다

    OK, 그냥 같은 문제에 부딪쳤다 .. 나는 먼 길을 주위에 갔다

    $('input').on('paste', function () {
      var element = this;
      setTimeout(function () {
        var text = $(element).val();
        // do something with text
      }, 100);
    });
    

    .val () FUNC까지 그냥 작은 시간 제한이 채워 할 수 있습니다.

    이다.


  2. 2.당신은 실제로 이벤트에서 값을 바로 잡을 수 있습니다. 그것의 비트 둔각은 어떻게 생각을 얻을 수 있습니다.

    당신은 실제로 이벤트에서 값을 바로 잡을 수 있습니다. 그것의 비트 둔각은 어떻게 생각을 얻을 수 있습니다.

    반환 거짓은 당신이 그것을 통과하지 않으려면.

    $(this).on('paste', function(e) {
    
      var pasteData = e.originalEvent.clipboardData.getData('text')
    
    });
    

  3. 3.크로스 플랫폼 호환성을 위해, 그것은 oninput 및 이벤트 onpropertychange 처리해야합니다 :

    크로스 플랫폼 호환성을 위해, 그것은 oninput 및 이벤트 onpropertychange 처리해야합니다 :

    $ (something).bind ("input propertychange", function (e) {
        // check for paste as in example above and
        // do something
    })
    

  4. 4.나는 종류의 다음 코드를 사용하여 고정 :

    나는 종류의 다음 코드를 사용하여 고정 :

    $("#editor").live('input paste',function(e){
        if(e.target.id == 'editor') {
            $('<textarea></textarea>').attr('id', 'paste').appendTo('#editMode');
            $("#paste").focus();
            setTimeout($(this).paste, 250);
        }
    });
    

    지금은 단지 :) 내가 ... 내가 모든 설정 생각하고있어 그 위치로 캐럿 위치와 APPEND를 저장해야


  5. 5.흠 ... 난 당신이 데이터를 붙여 넣을 잡을 e.clipboardData를 사용할 수 있다고 생각합니다. 그것은 밖으로 이동하지 않을 경우, 여기 봐.

    흠 ... 난 당신이 데이터를 붙여 넣을 잡을 e.clipboardData를 사용할 수 있다고 생각합니다. 그것은 밖으로 이동하지 않을 경우, 여기 봐.

    $(this).live("paste", function(e) {
        alert(e.clipboardData); // [object Clipboard]
    });
    

  6. 6.붙여 넣기 이벤트를 수신와의 keyup 이벤트 리스너를 설정합니다. 의 keyup에서 값을 캡처하고의 keyup 이벤트 리스너를 제거합니다.

    붙여 넣기 이벤트를 수신와의 keyup 이벤트 리스너를 설정합니다. 의 keyup에서 값을 캡처하고의 keyup 이벤트 리스너를 제거합니다.

    $('.inputTextArea').bind('paste', function (e){
        $(e.target).keyup(getInput);
    });
    function getInput(e){
        var inputText = $(e.target).val();
        $(e.target).unbind('keyup');
    }
    

  7. 7.

    $("#textboxid").on('input propertychange', function () {
        //perform operation
            });
    

    그것은 잘 작동합니다.


  8. 8.이 가까이 당신이 할 수 있습니다 무엇을 얻고있다.

    이 가까이 당신이 할 수 있습니다 무엇을 얻고있다.

    function sanitize(s) {
      return s.replace(/\bfoo\b/g, "~"); 
    };
    
    $(function() {
     $(":text, textarea").bind("input paste", function(e) {
       try {
         clipboardData.setData("text",
           sanitize(clipboardData.getData("text"))
         );
       } catch (e) {
         $(this).val( sanitize( $(this).val() ) );
       }
     });
    });
    

    제발 참고하여 clipboardData 객체는 현재 요소의 전체 가치 +를 clipboard'ed 값을 받고 (다음 다른 브라우저에 IE를) 찾을 수 없을 때.

    당신이 정말로 데이터 만이 진정 요소에 붙여 있었는지 후에 경우에 당신은 아마, 입력하기 전에 & 입력 한 후, 두 값을 DIF 몇 가지 추가 단계를 수행 할 수 있습니다.


  9. 9.

     $('').bind('input propertychange', function() {....});                      
    

    이 기능은 마우스 붙여 넣기 이벤트에 대해 작동합니다.


  10. 10.어떻게 붙여 넣은 값의 차이를 필드의 원래 값과 필드의 변경 값을 비교하고 공제에 대해? 이 분야에서 기존 텍스트가있는 경우에도 제대로 붙여 넣은 텍스트를 잡는다.

    어떻게 붙여 넣은 값의 차이를 필드의 원래 값과 필드의 변경 값을 비교하고 공제에 대해? 이 분야에서 기존 텍스트가있는 경우에도 제대로 붙여 넣은 텍스트를 잡는다.

    http://jsfiddle.net/6b7sK/

    function text_diff(first, second) {
        var start = 0;
        while (start < first.length && first[start] == second[start]) {
            ++start;
        }
        var end = 0;
        while (first.length - end > start && first[first.length - end - 1] == second[second.length - end - 1]) {
            ++end;
        }
        end = second.length - end;
        return second.substr(start, end - start);
    }
    $('textarea').bind('paste', function () {
        var self = $(this);
        var orig = self.val();
        setTimeout(function () {
            var pasted = text_diff(orig, $(self).val());
            console.log(pasted);
        });
    });
    

  11. 11.이 코드는 마우스 오른쪽 버튼으로 클릭하거나 직접 복사 붙여 넣기에서 붙여 넣으 나를 위해 노력하고 있습니다

    이 코드는 마우스 오른쪽 버튼으로 클릭하거나 직접 복사 붙여 넣기에서 붙여 넣으 나를 위해 노력하고 있습니다

       $('.textbox').on('paste input propertychange', function (e) {
            $(this).val( $(this).val().replace(/[^0-9.]/g, '') );
        })
    

    내가 1 절을 붙여 넣을 때 : 노동은 텍스트 상자에 1이 비용.

    이 코드를 사용하는 경우에만 부동 소수점 값을 허용하려면

     //only decimal
        $('.textbox').keypress(function(e) {
            if(e.which == 46 && $(this).val().indexOf('.') != -1) {
                e.preventDefault();
            } 
           if (e.which == 8 || e.which == 46) {
                return true;
           } else if ( e.which < 48 || e.which > 57) {
                e.preventDefault();
          }
        });
    

  12. 12.

    document.addEventListener('paste', function(e){
        if(e.clipboardData.types.indexOf('text/html') > -1){
            processDataFromClipboard(e.clipboardData.getData('text/html'));
            e.preventDefault();
    
            ...
        }
    });
    

  13. 13.http://www.p2e.dk/diverse/detectPaste.htm이 예를 참조하십시오

    http://www.p2e.dk/diverse/detectPaste.htm이 예를 참조하십시오

    이 문자열 비교하여 페이스트의 경우는 essentialy 이벤트 다음 확인 oninput에 모든 변경을 추적합니다. 아, 그리고 IE에서 onpaste 이벤트가있다. 그래서:

    $ (something).bind ("input paste", function (e) {
        // check for paste as in example above and
        // do something
    })
    

  14. 14.이 방법을 사용 jqueries 컨텐츠 (). 언랩 ().

    이 방법을 사용 jqueries 컨텐츠 (). 언랩 ().


  15. 15.이것은 매우 착각 입증했다. 입력 값은 페이스트 이벤트 함수 내에서 코드의 실행 전에 업데이트되지 않는다. 나는 아직도 모든 이벤트의 기능을 내부에 붙여 넣은 텍스트 업데이트되지 않습니다 붙여 넣기 이벤트 기능 만 입력 값 내에서 다른 이벤트를 호출했습니다. 즉의 keyup에서 떨어져 모든 이벤트입니다. 당신이 붙여 넣기 이벤트 함수 내에서의 keyup 호출하는 경우에는 KeyUp 이벤트 함수 내에서 붙여 넣은 텍스트를 소독 할 수 있습니다. 같은 ...

    이것은 매우 착각 입증했다. 입력 값은 페이스트 이벤트 함수 내에서 코드의 실행 전에 업데이트되지 않는다. 나는 아직도 모든 이벤트의 기능을 내부에 붙여 넣은 텍스트 업데이트되지 않습니다 붙여 넣기 이벤트 기능 만 입력 값 내에서 다른 이벤트를 호출했습니다. 즉의 keyup에서 떨어져 모든 이벤트입니다. 당신이 붙여 넣기 이벤트 함수 내에서의 keyup 호출하는 경우에는 KeyUp 이벤트 함수 내에서 붙여 넣은 텍스트를 소독 할 수 있습니다. 같은 ...

    $(':input').live
    (
        'input paste',
        function(e)
        {
            $(this).keyup();
        }
    );
    
    $(':input').live
    (
        'keyup',
        function(e)
        {
            // sanitize pasted text here
        }
    );
    

    여기에서주의해야 할 점은있다. 텍스트가 다음 각의 keyup 휴식의 브라우저 기능을 값을 다시 입력 폭에 의해 허용 볼 수있는 영역보다 긴 경우 파이어 폭스, 당신은 모든의 keyup에 입력 된 텍스트를 다시 설정하면 그 자동 스크롤에있는 caret 위치에있는 텍스트를 텍스트의 끝. 대신 텍스트 스크롤은 뷰에서 캐럿을 떠나 처음으로 백업 할 수 있습니다.


  16. 16.스크립트 클래스 포틀릿 형태의 입력 필드와 모든 필드에서 특수 문자를 제거합니다 :

    스크립트 클래스 포틀릿 형태의 입력 필드와 모든 필드에서 특수 문자를 제거합니다 :

    // Remove special chars from input field on paste
    jQuery('.portlet-form-input-field').bind('paste', function(e) {
        var textInput = jQuery(this);
        setTimeout(function() {
            textInput.val(replaceSingleEndOfLineCharactersInString(textInput.val()));
        }, 200);
    });
    
    function replaceSingleEndOfLineCharactersInString(value) {
        <%
            // deal with end-of-line characters (\n or \r\n) that will affect string length calculation,
            // also remove all non-printable control characters that can cause XML validation errors
        %>
        if (value != "") {
            value = value.replace(/(\x00|\x01|\x02|\x03|\x04|\x05|\x06|\x07|\x08|\x0B|\x0C|\x0E|\x0F|\x10|\x11|\x12|\x13|\x14|\x15|\x16|\x17|\x18|\x19|\x1A|\x1B|\x1C|\x1D|\x1E|\x1F|\x7F)/gm,'');
            return value = value.replace(/(\r\n|\n|\r)/gm,'##').replace(/(\#\#)/gm,"\r\n");
        }
    }
    

  17. 17.

    function scroll(elementToBeScrolled) 
    {
         //this will reset the scroll to the bottom of the viewable area. 
         elementToBeScrolled.topscroll = elementToBeScrolled.scrollheight;
    }
    
  18. from https://stackoverflow.com/questions/686995/catch-paste-input by cc-by-sa and MIT license