2015-01-08 1 views
1

입력 영역을 텍스트 영역에서 누를 수 있지만 출력을 두 줄 이상으로 제한하지 않으려합니다. 더 잘 설명하기 위해 사진 프레임 디자이너 here이 있습니다. 옵션에서 텍스트를 입력하면 프레임에 나타납니다. 현재 텍스트 영역에서 2 번 이상 Enter 키를 누르면 그럴 수 없습니다. 텍스트가 너무 길어 자동으로 새 줄로 바뀌면 문제가 발생합니다.텍스트 영역으로 쓸 수있는 행 수 제한

다음은 관련 코드입니다.

$(document).ready(function(){   
    var lines = 2; 
    var linesUsed = $('#linesUsed'); 

    $('#input').keydown(function(e) { 
     newLines = $(this).val().split("\n").length; 
     linesUsed.text(newLines); 
     if(e.keyCode == 13 && newLines >= lines) { 
      return false; 
     } 
    }); 
}); 

TEXTAREA의 줄 수를 제한하는 일부 jquery입니다.

그리고 텍스트 영역

<textarea id="input" maxlength="40" name="Text" value="Max. 40 characters"></textarea> 

텍스트 영역

$('#input').keyup(function() { 
    $('#text').html($(this).val()); 
}); 

이 입력 된 텍스트가 인쇄됩니다 내 SVG에 포함 된 HTML이다에서 입력을 출력 JQuery와.

당신이 데모 사이트에서 볼 수 있듯이,이 두 솔루션 단지 : 여기

<foreignObject x="135" y="520" width="600" height="260" style="color:white;text-align:center"> 
    <body xmlns="http://www.w3.org/1999/xhtml"> 
     <div id="container2"> 
      <p id="text">Your words here</p> 
     </div> 
    </body> 
</foreignObject> 

답변

0

wrap=off 속성을 사용하면 텍스트 영역의 자동 줄 바꿈을 방지 할 수 있습니다. 이는 비표준이지만 HTML 초창기부터 광범위하게 지원됩니다.

<textarea id="input" maxlength="40" name="Text" 
 
placeholder="Max. 40 characters" wrap="off"></textarea>
은 (내가 placeholder 속성에 value 속성을 변경했습니다. value 속성이 textarea 유효하지 않습니다.)

다른, 어쩌면 더 나은 방법이 문제를 방지하는 것입니다 textarea 필드 대신 두 개의 input type=text 필드를 사용하십시오. 그렇다면 두 줄 이상의 항목을 막기 위해 JavaScript가 필요하지 않지만 각 줄마다 한도를 설정하는 대신 총 문자 수에 대한 제한이 필요한 경우 간단한 JavaScript가 필요합니다.

+0

Ahh 알 수 있습니다. 그래, 자리 표시자는 감사를 향상시킵니다. 차라리 입력을 사용하지 않을 것입니다. JavaScript를 더 쉽게 수행 할 수 있습니다. 그러나 감사는 랩 속성에 대해 알지 못했습니다. –

-3

2 자바 스크립트의이 당신을 도울 수있는 라이브러리입니다 작업.

+0

두 번째 마지막 업데이트 3 년 전 !! – atmd

+0

그래서 뭐? 작동하면 작동합니다 ... 지난 3 년 동안 textarea 요소가 근본적으로 바뀌지 않은 것입니다. – user1120808

+0

jquery 버전 1.4가 있지만 그 이후로 어떤 버전에서도 테스트되지 않았을 수 있습니다. – atmd

관련 문제