jquery를 통해 레이블 텍스트에 액세스

Question

jquery를 사용하여 <label> 요소의 텍스트를 가져 오는 방법이 있습니까? 우리는 $(this).val();을 사용하여 값을 얻을 수 있기 때문에 레이블 텍스트에 대해 동일한 작업을 수행 할 수 없습니다.

$(this)은 라디오 버튼이 선택되었을 때 $(this)을 사용하여 텍스트를 쿼리 할 수있는 것처럼 보입니다. $(this)은 그 시간 동안 값을 알고 있기 때문입니다.

처음에는 case 문을 사용하고 일부 텍스트를 직접 채우지 만 대신 레이블 텍스트를 삽입하면 사용중인 모든 case 문이 필요하지 않게됩니다.

생각/제안?

HTML

<div class="panel panel-default"> 
        <div class="panel-heading"> 
         <h4 class="panel-title"> 
          <a data-toggle="collapse" data-parent="#accordion" href="#accordion-second">What You Are Interested In Learning About</a> 
         </h4> 
        </div> 
        <div id="accordion-second" class="panel-collapse collapse"> 
         <div class="panel-body"> 
          <div class="radio"> 
           <label><input type="radio" name="optradio2" value="2a">the Automotive Industry</label> 
          </div> 
          <div class="radio"> 
           <label><input type="radio" name="optradio2" value="2b">the sports industry</label> 
          </div> 
          <div class="radio"> 
           <label><input type="radio" name="optradio2" value="2c">the music industry</label> 
          </div> 
         </div> 
        </div> 
       </div> 

JQuery와

<script> 
    $('[name="optradio2"]').on('change', function() { 
     $('#accordion-third').slideToggle(); 
     $('#accordion-second').slideToggle(); 

     //how do you get the label text 
     var labelText = $("label", this).text(); 

     //current method but would prefer to just insert the label text 
     /*var value = $(this).val(); 
     switch (value) { 
      case "2a": 
       $('#blank2', $('#myModal')).text('the automotive industry'); 
       break; 
      case "2b": 
       $('#blank2', $('#myModal')).text('the sports industry'); 
       break; 
      case "2c": 
       $('#blank2', $('#myModal')).text('the music industry'); 
       break; 
      default: 
       alert("oops! something went wrong"); 
     }*/ 
}) 
</script> 

Answer 1

컨텍스트 선택기 자손 find 및 검색을 이용한다.

레이블은 부모를보고있다 그래서, 다른 방법으로 주위있어, 입력의 아이가 아닌, 그리고 closest는 HTMLInputElement.labels를 사용하여, 당신은 관련 <label>에 액세스 할 수 있습니다

var labelText = $(this).closest("label").text(); 

Answer 2

맞는 것 같다 배열 인덱스 표기법을 사용하여, 특정 <input>과 관련된 <label> 요소의 NodeList를을 반환 속성, 첫 번째 (보통) 얻을 :

this.labels[0].textContent; 

참고 자료 :

• HTMLInputElement.