jQuery가 자동으로 증가하는 텍스트 입력 상자 구현 code_jquery

사용자 경험을 향상시키기 위해 점심시간에 jQuery를 사용하여 플러그인을 작성할 수 있을지 고민했습니다. 나도 하면 좋겠다고 생각했고, 아니나 다를까 이 기능을 깨달았습니다. 이 플러그인을 작성할 때 누군가가 인터넷에서 이런 플러그인을 작성했어야 했다고 무의식적으로 생각했지만, 검색해 본 것은 아니니 관심이 있으시면 찾아보시면 됩니다. 아래는 플러그인의 소스코드입니다.
소스 코드

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

;(function( $) {
$.fn.autoSizeText = function(settings) {
var _defaultSettings = {min:20,max:40}
var _settings = $.extend(_defaultSettings, settings); >var _handler = function() {
jQuery(this).keyup(function() {
if (jQuery(this).attr("type") != 'text') {
return false ;
}
jQuery(this).attr("size", _settings.min)
var actLength = jQuery(this).val().length
if (actLength > _settings; .min && actLength < _settings.max) {
jQuery(this).attr("size", actLength 1)
} else if (actLength <= _settings.min) {
jQuery( this).attr("size", _settings.min);
}
return this.each(_handler)
}; (jQuery) ;


$(':text').autoSizeText(); 메소드를 호출합니다.
이 플러그인에는 두 가지 선택적 매개변수가 있습니다. max(텍스트 상자의 최대 크기 설정, 크기는 이 값 이상으로 증가하지 않음, 기본값은 40) 및 min(텍스트 상자의 최소 크기 설정, 이는 텍스트 상자의 초기 크기이기도 함), 기본값은 20)이며 호출 시 수정할 수 있습니다.
예: $(':text').autoSizeText({min:24,max:35})

$(':text').autoSizeText({max:35});//min 없음 설정, 기본값 20
$(':text').autoSizeText({min:12});//max가 설정되지 않음, 기본값 40
계속 확장할 수 있습니다. 예를 들어 텍스트 영역을 지원합니다.
즐기세요!