사용자 (input) (html 요소)와 사용자 (input)의 입력 (text) 사용자가 타이핑 할 때 입력 (HTML 요소)이 자동으로 커지도록 만드는 방법이 있습니까?내부의 텍스트가 입력 자체보다 크면 html 입력을 확장하는 방법
Obs. CSS로만 만든 경우 더 좋음
----------------------------------- EDIT 1- ----------------------------------
나는 JSfiddle을 만들었으며 알 수 있습니다. 많은 텍스트를 입력하면 텍스트가 잘립니다.
<input type="text" id="inputbox" name="input" placeholder="yes"/>
그리고에 시작할 때 그것은 더 이상 아래로 크기를 조정하지 않습니다 지금과 같이, 그것은 <span contenteditable="true" >
당신은 어떤 자바 스크립트/JQuery와 솔루션이 필요하면 내가 대신 입력 요소의 contenteditable 사업부를 사용하도록 추천 할 것입니다
여기 https://jsfiddle.net/sohelansari/631uzco9
이 또는 당신이 원하는 경우 예를의 입력 요소 만 사용하려면 불행히도 순수 CSS 솔루션을 사용할 수 없습니다. jquery 플러그인을 작성할 수 있습니다. 예 : Is there a jQuery autogrow plugin for text fields?.
스팬을 클릭 할 때 나타나는 경계 상자를 제거하는 방법이 있습니까? –
@HenriqueAlmeidaMarcomini 가능합니다. 내 대답에 바이올린을 업데이트했습니다. – shinobi
당신의 방법은 매력처럼 작동했습니다. Althrough I belive css는 그것을 처리하기로되어 있습니다. 내 투표와 올바른 대답을 얻었습니다 –
<span contenteditable="true" style="display: inline-block; border: solid 1px black; min-width: 50px; max-width: 200px"></span>
안녕하세요 bootle; 코드가 정확할 수도 있지만 일부 컨텍스트에서는 더 나은 대답을 얻을 수 있습니다. 예를 들어이 제안 된 변경이 어떻게 그리고 왜 관련 문서에 대한 링크를 포함하여 질문자의 문제를 해결할 수 있는지 설명 할 수 있습니다. 그것은 그것에게 더 유용 할 것이고, 유사한 문제에 대한 해결책을 찾고있는 다른 사이트 독자에게 더 유용 할 것이다. –
<input type="text" id="inputbox" name="input" placeholder="yes" width="100px"/>
폭 = "100 픽셀을"제거 작업을 만들려고 해요 유형.
function copy_data(val){
var a = document.getElementById(val.id).value
document.getElementById("text_to").value=a
}
</script>
</head>
<TEXTAREA ID="text_from" style="height:100px; width:600px;">
</TEXTAREA>
<TEXTAREA ID="text_to" style="height:100px; width:600px;">
</TEXTAREA>
<button onclick=copy_data(text_from)>Copy</button>
http://stackoverflow.com/questions/7168727/make-html-text-input-field-grow-as-i-type – Pawan