자바스크립트 예제모음

문자열 앞뒤 공백 제거하기

전체 문자열 배열 폼관련
URL : https://ktsmemo.cafe24.com/s/javascript/574
등록일 :

문자열 앞뒤 공백 제거


정규식을 이용해서 간단히 제거 할 수 있습니다.
간단한 예제로 만들어 보았습니다.

HTML

<div class="wrap">
<input type="text" name="ori" value="        앞에도 공백이 있고 뒤에도 공백이 있었다고 한다.        " />

<div style="padding:10px">
	<button type="button" onclick="gogogo()">눌러보세요 : 앞뒤 공백 제거하기</button>
</div>

<input type="text" name="rst" value="" />
</div>

자바스크립트

function gogogo(){
	var txt = $('.wrap [name=ori]').val();

	// 화이트 스페이스(공백 포함) 을 제거하는 정규식
	// 문자열 앞, 뒤 공백을 모두 제거
	txt = txt.replace(/^\s+|\s+$/g, '');

	$('.wrap [name=rst]').val(txt);
}



공백이 연속되어 있어도 전부 제거됩니다.



제이쿼리 trim 메서드 사용하기

제이쿼리를 사용중이라면 trim 메서드도 있습니다.

HTML

<div class="wrap">
<input type="text" name="ori" value="        앞에도 공백이 있고 뒤에도 공백이 있었다고 한다. 제이쿼리로 해본다고 한다.        " />

<div style="padding:10px">
	<button type="button" onclick="gogogo()">눌러보세요 : 앞뒤 공백 제거하기</button>
</div>

<input type="text" name="rst" value="" />
</div>

자바스크립트

function gogogo(){
	var txt = $('[name=ori]').val();

	// 제이쿼리 trim 메서드 사용
	txt = $.trim(txt);

	$('[name=rst]').val(txt);
}