>웹 프론트엔드 >JS 튜토리얼 >TextArea는 최대 길이 솔루션(jquery)_jquery를 지원하지 않습니다.

TextArea는 최대 길이 솔루션(jquery)_jquery를 지원하지 않습니다.

WBOY
WBOY원래의
2016-05-16 18:02:221253검색

나는 오랫동안 .net 컨트롤을 사용해 왔습니다. 페이지의 TextBox에 길이 컨트롤을 추가할 때 간단히 maxlength='xxx'를 추가했지만 테스트가 항상 실패하는 이유는 여러 줄 모드가 설정되어 있기 때문입니다. 이 경우 생성된 HTML 코드는 textarea이고, IE는 textarea의 maxlength 속성을 지원하지 않기 때문에 maxlength 속성이 추가되지 않습니다. 따라서 Firefox 6에서 테스트한 결과, Firefox는 이 속성을 지원하는 것으로 확인되었습니다. 그렇다면 간단합니다. 텍스트 영역의 최대 길이를 쉽게 제어할 수 있도록 jquery 확장 기능을 직접 작성했습니다.
확장 코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

(function($) {
$.fn.textarealimit = function(settings) {
settings = jQuery.extend({
length:1000
}, settings);
maxLength = settings.length
$(this).attr("maxlength",maxLength).bind("keydown",doKeydown).bind("keypress",doKeypress).bind("beforepaste",doBeforePaste).bind( "paste",doPaste) ;
function doKeypress()
{
var oTR = document.selection.createRange()
if(oTR.text.length >= 1)
event .returnValue = true
else if(this.value.length > maxLength-1)
event.returnValue = false
}
function doKeydown()
{
var _obj= this;
setTimeout(function()
{
if(_obj.value.length > maxLength-1)
{
var oTR = window.document.selection.createRange()
oTR.moveStart( "character", -1*(_obj.value.length-maxLength))
oTR.text = ""
}
},1)
}
function doBeforePaste()
{
event.returnValue = false
}
function doPaste()
{
event.returnValue = false
var oTR = document.selection.createRange ()
var iInsertLength = maxLength - this.value.length oTR.text.length
var sData = window.clipboardData.getData("Text").substr(0, iInsertLength)
oTR.text = sData;
}
}
})(jQuery);

위에서는 IE의 특성상 복사 및 붙여넣기 제어만 제어합니다. 이러한 방법은 Firefox에서는 유효하지 않습니다.
통화 코드:
코드 복사 코드는 다음과 같습니다.

$(document ).ready (function() {
$("#ctl00_ZiiOContent_ucQuestionnaire_txtquestion4_2").textarealimit();
})
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.