입력 값에 정적 텍스트를 추가하는 방법

헬존

입력 요소가 있고 사용자가 입력하면이 정적 텍스트가 항상 사용자 입력 후에 나타납니다.

h "staticTextHere"
hello "staticTextHere"
hello world "staticTextHere"

몇 가지 기술을 시도했지만 여기에 너무 많은 문제가 있습니다. 이것을 달성하는 방법에 대한 아이디어가 있습니까?

여기 내 코드가 있습니다.

<input type="text" id="staticTextId" name="staticTextName" ..... />

그리고 js;

.on('keydown', function (event) {
         var textLength = document.getElementById($id).value.length;
         document.getElementById($id).value = document.getElementById($id).value.substr(0,textLength - staticText.length) + staticText;
 });
Amosrivera

일반 JS 버전 : 온라인 데모

jQuery : 온라인 데모

document.getElementById("staticTextId").addEventListener('keyup', function(){
    var str = this.value;
    var suffix = " static text";

    if(str.search(suffix) === -1){
        str += suffix;
    }

    var actualLength = str.length - suffix.length;

    // set the value
    this.value = str.substr(0,actualLength) + suffix;

    // set cursor position
    this.setSelectionRange(actualLength,actualLength);    
});

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

Laravel 양식 텍스트 입력에 정적 텍스트를 추가하는 방법은 무엇입니까?

분류에서Dev

입력 필드 앞에 텍스트를 추가하는 방법

분류에서Dev

입력 위에 텍스트를 정렬하는 데 가장 적합한 방법은 무엇입니까?

분류에서Dev

Flutter에서 TextFormField에 정적 단위 (텍스트)를 추가하는 방법은 무엇입니까?

분류에서Dev

Java GUI-정적 메서드에서 JTextArea에 텍스트를 추가하는 방법은 무엇입니까?

분류에서Dev

Excel 셀에 값과 텍스트를 입력하는 방법

분류에서Dev

PHP를 사용하여 여러 입력 텍스트 필드 값을 db에 추가하는 방법

분류에서Dev

JS의 정적 텍스트에 HTML 콘텐츠를 추가하는 방법

분류에서Dev

React / Jest / Enzyme : 입력에 텍스트를 추가하고 해당 텍스트를 확인하는 방법을 테스트하는 방법은 무엇입니까?

분류에서Dev

같은 필드에 텍스트를 입력 한 후 입력을 추가하는 방법

분류에서Dev

입력 상자에 입력 한 정보를 텍스트 파일 (json)에 저장 (덤프)하는 방법

분류에서Dev

입력 상자에 입력 한 정보를 텍스트 파일에 저장하는 방법

분류에서Dev

입력 숫자 값으로 텍스트 영역 입력을 동적으로 추가하는 방법은 무엇입니까? AngularJs

분류에서Dev

사용자가 React native otp 입력을 사용하여 otp 텍스트 입력에서 텍스트를 삭제할 때 재설정 상태를 추가하는 방법은 무엇입니까?

분류에서Dev

AngularJS를 사용하여 트리 뷰에 정적 값을 추가하는 방법은 무엇입니까?

분류에서Dev

jquery를 사용하여 동적 입력 텍스트의 값을 얻는 방법은 무엇입니까?

분류에서Dev

입력 텍스트를 통해 새로 추가 된 스팬 값을 표시하는 방법

분류에서Dev

정적 텍스트에 스타일 클래스를 적용하는 방법은 무엇입니까?

분류에서Dev

jquery를 사용하여 동적으로 추가 된 입력 상자의 입력 값을 가져 오는 방법

분류에서Dev

이미지 위에 텍스트를 동적으로 추가하는 방법은 무엇입니까?

분류에서Dev

요소에 동적으로 추가 된 텍스트를 분할하는 방법은 무엇입니까?

분류에서Dev

createEvent 및 dispatchEvent를 사용하여 포커스를 설정하고 입력 텍스트에 텍스트를 설정하는 방법은 무엇입니까?

분류에서Dev

값을 입력하는 동안 텍스트 필드의 너비를 동적으로 변경하는 방법

분류에서Dev

텍스트 파일에서 특정 값 / 필드를 추출하는 방법은 무엇입니까?

분류에서Dev

특정 단어 뒤에 텍스트 파일에 변수를 추가하는 방법은 무엇입니까?

분류에서Dev

입력 값에 자바 스크립트 ID를 설정하는 방법

분류에서Dev

입력 및 레이블 필드에 추가 정보를 의미 론적으로 마크 업하는 방법

분류에서Dev

입력 상자를 통해 사용자 지정 텍스트를 추가하는 방법

분류에서Dev

buttonclick에서 입력 텍스트를 제거하고 tkinter에서 출력 텍스트 형식을 지정하는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    Laravel 양식 텍스트 입력에 정적 텍스트를 추가하는 방법은 무엇입니까?

  2. 2

    입력 필드 앞에 텍스트를 추가하는 방법

  3. 3

    입력 위에 텍스트를 정렬하는 데 가장 적합한 방법은 무엇입니까?

  4. 4

    Flutter에서 TextFormField에 정적 단위 (텍스트)를 추가하는 방법은 무엇입니까?

  5. 5

    Java GUI-정적 메서드에서 JTextArea에 텍스트를 추가하는 방법은 무엇입니까?

  6. 6

    Excel 셀에 값과 텍스트를 입력하는 방법

  7. 7

    PHP를 사용하여 여러 입력 텍스트 필드 값을 db에 추가하는 방법

  8. 8

    JS의 정적 텍스트에 HTML 콘텐츠를 추가하는 방법

  9. 9

    React / Jest / Enzyme : 입력에 텍스트를 추가하고 해당 텍스트를 확인하는 방법을 테스트하는 방법은 무엇입니까?

  10. 10

    같은 필드에 텍스트를 입력 한 후 입력을 추가하는 방법

  11. 11

    입력 상자에 입력 한 정보를 텍스트 파일 (json)에 저장 (덤프)하는 방법

  12. 12

    입력 상자에 입력 한 정보를 텍스트 파일에 저장하는 방법

  13. 13

    입력 숫자 값으로 텍스트 영역 입력을 동적으로 추가하는 방법은 무엇입니까? AngularJs

  14. 14

    사용자가 React native otp 입력을 사용하여 otp 텍스트 입력에서 텍스트를 삭제할 때 재설정 상태를 추가하는 방법은 무엇입니까?

  15. 15

    AngularJS를 사용하여 트리 뷰에 정적 값을 추가하는 방법은 무엇입니까?

  16. 16

    jquery를 사용하여 동적 입력 텍스트의 값을 얻는 방법은 무엇입니까?

  17. 17

    입력 텍스트를 통해 새로 추가 된 스팬 값을 표시하는 방법

  18. 18

    정적 텍스트에 스타일 클래스를 적용하는 방법은 무엇입니까?

  19. 19

    jquery를 사용하여 동적으로 추가 된 입력 상자의 입력 값을 가져 오는 방법

  20. 20

    이미지 위에 텍스트를 동적으로 추가하는 방법은 무엇입니까?

  21. 21

    요소에 동적으로 추가 된 텍스트를 분할하는 방법은 무엇입니까?

  22. 22

    createEvent 및 dispatchEvent를 사용하여 포커스를 설정하고 입력 텍스트에 텍스트를 설정하는 방법은 무엇입니까?

  23. 23

    값을 입력하는 동안 텍스트 필드의 너비를 동적으로 변경하는 방법

  24. 24

    텍스트 파일에서 특정 값 / 필드를 추출하는 방법은 무엇입니까?

  25. 25

    특정 단어 뒤에 텍스트 파일에 변수를 추가하는 방법은 무엇입니까?

  26. 26

    입력 값에 자바 스크립트 ID를 설정하는 방법

  27. 27

    입력 및 레이블 필드에 추가 정보를 의미 론적으로 마크 업하는 방법

  28. 28

    입력 상자를 통해 사용자 지정 텍스트를 추가하는 방법

  29. 29

    buttonclick에서 입력 텍스트를 제거하고 tkinter에서 출력 텍스트 형식을 지정하는 방법은 무엇입니까?

뜨겁다태그

보관