[Jquery] a태그 텍스트값 가져오는 방법!

오늘은 a태그의 텍스트값을 제이쿼리로 값을 가져오는 방법을 이야기해보겠습니다.

목적은 html의 a태그에 위치한 텍스트값을 제이쿼리를 통해서 서버(컨트롤러)로 보내기 위함입니다.

이렇게 정리하면 쉬워보이는데…모르면 참 어려운 제이쿼리인 것 같습니다.

 

---

 

우선 form태그안에 변수 kind를 선언합니다.

<input type="hidden" name="kind" id="kind" />

 

 

그리고 사용될 a태그에서 onclick으로 함수를 정의합니다.

이때 괄호에 this를 넣어 클릭된 값을 저장할 수 있도록합니다.

<li><a href="#none" onclick="test(this)" >테스트입니다.</a></li>

 

 

그리고 스크립트부분에서 onclick함수를 정의합니다.

이때 괄호에 this의 별칭(ths)를 넣어줍니다.

여기가 가장 중요한 부분입니다!

hello 변수안에 this값의 텍스트를 넣어줍니다. $(ths).text();

그리고 hidden으로 숨겨놓은 kind변수에 hello 값을 넣어주면 서버(컨트롤러)로 보내질 수 있게 됩니다.

 

<script>
 
function test(ths){
        var hello = $(ths).text();
        $('#kind').val(hello);
 
</script>