A 태그 value 값 가져오기 - a taegeu value gabs gajyeoogi

Front/Javascript·Jquery

클릭한 li태그의 value값 가져오기, li태그의 value 문자일때 변환

JENN_tech 2022. 5. 11. 20:25

<ul class="operate">
    <li class="all on" value="">
        <a href="#;">
            <h4>전체</h4>
            <p>140</p>
        </a>
    </li>
    <li class="sensitive" value="1">
        <a href="#;">
            <h4>민감 계층 이용 시설</h4>
            <p>30</p>
        </a>
    </li>
    <li class="traffic" value="2">
        <a href="#;">
            <h4>교통관련 시설</h4>
            <p>50</p>
        </a>
    </li>
</ul>

  $('.operate li').on('click', function(e) {
    	   
               console.log($(this).val());
       })

li태그의 value를 db에 저장된 공통코드와 맞게 SD233이런식으로 하려고했는데 자꾸 0만 가져왔다

알고보니 li태그의 value는 숫자만됨...

그래서 각각 숫자를 넣어주고 type변환하는 함수를 생성해서 호출시키는 형식으로 만듬

function parseType(type) {
    	   switch (type) {
    	   case 0:
    		   type = ''
    			   break;
    	   case 1:
    		   type = 'FT01'
    			   break;
    	   case 2:
    		   type = 'FT02'
    			   break;
    	   case 3:
    		   type = 'FT03'
    			   break;
    	   case 4:
    		   type = 'FT04'
    			   break;
    	   default:
    	   }
    	   return type;
       }

jquery

jQuery 를 이용하여 id, class, name 의 input value 값 가져오기

쉬운코딩이최고 2021. 6. 10. 02:33

■ jQuery 를 이용하여 id, class, name 의 input value 값 가져오기

위와 같은 input tag 가 있다고 가정 하겠습니다. 

이 input tag 에 id, class, name 값을 각각 지정 했습니다. 

버튼을 하나 만들어서 클릭 이벤트 발생 시 getInputValue() 라는 함수가 호출 되도록 했습니다. 

이제 getInputValue() 라는 함수를 정의해야 합니다. 

첫번째 input tag 의 value 값을 가져 오는 방법은 아래와 같이 세가지가 있습니다. 

▶ id 값 기준으로 가져 오기

var valueById = $('#inputId').val();

# 은 아이디를 의미

▶ class 값 기준으로 가져 오기

var valueById = $('.inputClass').val();

. 은 클래스를 의미

▶ name 값 기준으로 가져 오기

var valueById = $('input[name=inputName]').val();

위와 같은 방법으로 id, class, name 별로 값을 가져 올 수 있습니다. 

실제 호출 하는 예제를 보시겠습니다. 

위 코드들을 이용 하면 아래와 같은 결과물을 보실 수 있습니다.

input 에 값을 입력 후 Get Value 버튼을 클릭 하시면 입력된 값이 리턴 되는 것을 확인 할 수 있습니다. 

▼ 도움이 되셨다면 로그인이 필요 없는 ▼

▼ 하트 클릭 한번 부탁 드립니다 ▼

감사합니다 :D