텍스트 입력 필드의 끝으로 캐럿을 이동하고 끝을 보이게하십시오.

나는 정신 나간다. 나는 사용자가 제안을 선택할 수있는 자동 제안 상자가 있습니다. 다음 추천 선택에서 텍스트 입력 상자의 값이 해당 크기를 초과합니다. 입력란 크로스 브라우저 끝까지 캐럿을 옮길 수 있습니다. 문제 없습니다. 하지만 크롬과 사파리에서는 끝까지 캐럿을 볼 수 없습니다. 텍스트의 끝은 보이지 않습니다.텍스트 입력 필드의 끝으로 캐럿을 이동하고 끝을 보이게하십시오.

캐럿을 텍스트 입력 필드의 끝으로 옮기고 필드의 끝을 표시하여 사용자가 입력 캐럿의 위치를 혼동하지 않도록 할 수 있습니까? 내가 지금까지 무엇을 가지고

<html> 
<head><title>Field update test</title></head> 

<body> 
<form action="#" method="POST" name="testform"> 

<p>After a field is updated the carat should be at the end of the text field AND the end of the text should be visible</p> 

<input type="text" name="testbox" value="" size="40"> 

<p><a href="javascript:void(0);" onclick="add_more_text();">add more text</a></p> 

</form> 

<script type="text/javascript"> 
<!-- 
var count = 0; 

function add_more_text() { 
    var textfield = document.testform.elements['testbox']; 

    textfield.focus(); 

    if (count == 0) textfield.value = ''; // clear old 

    count++; 
    textfield.value = textfield.value + (textfield.value.length ? ', ' : '') + count + ": This is some sample text"; 

    // move to the carat to the end of the field 
    if (textfield.setSelectionRange) { 
     textfield.setSelectionRange(textfield.value.length, textfield.value.length); 
    } else if (textfield.createTextRange) { 
     var range = textfield.createTextRange(); 
     range.collapse(true); 
     range.moveEnd('character', textfield.value.length); 
     range.moveStart('character', textfield.value.length); 
     range.select(); 
    } 

    // force carat visibility for some browsers 
    if (document.createEvent) { 
     // Trigger a space keypress. 
     var e = document.createEvent('KeyboardEvent'); 
     if (typeof(e.initKeyEvent) != 'undefined') { 
     e.initKeyEvent('keypress', true, true, null, false, false, false, false, 0, 32); 
     } else { 
     e.initKeyboardEvent('keypress', true, true, null, false, false, false, false, 0, 32); 
     } 
     textfield.dispatchEvent(e); 

     // Trigger a backspace keypress. 
     e = document.createEvent('KeyboardEvent'); 
     if (typeof(e.initKeyEvent) != 'undefined') { 
     e.initKeyEvent('keypress', true, true, null, false, false, false, false, 8, 0); 
     } else { 
     e.initKeyboardEvent('keypress', true, true, null, false, false, false, false, 8, 0); 
     } 
     textfield.dispatchEvent(e); 
    } 
} 
// --> 
</script> 

</body> 
</html>

감사

출처

2010-04-22 whereisalext

는 I는 해결책을 제공했다. 웹킷 (사파리와 크롬)은 키보드 이벤트를 올바르게 수행하기 위해 바지에 킥이 필요합니다. 백 스페이스 앞에 blur()를 추가 한 다음 focus()를 추가하십시오.

textfield.blur(); // Webkit wake-up hack 
    textfield.focus(); 
    textfield.dispatchEvent(e);

감사합니다. Safari, Chrome, FF, Mac 및 Windows 용 IE에서 작동합니다.

출처

2010-04-22 15:57:03 whereisalext

텍스트 입력 필드의 끝으로 캐럿을 이동하고 끝을 보이게하십시오.

답변

관련 문제