2011-03-18 14 views
0
<form id="test" onsubmit="return checkParams();" method="post" action=""> 
    <div class="input-inside-label"> 
     <label for="loc">12345</label> 
     <input class="grab-label" value="" type="text" name="loc" id="loc"> 
    </div> 
</form> 

입력 한 값이 비어 있습니다. 그러나 나는 그것이 비어있게 제출되기를 원하지 않는다. 양식을 제출하면 레이블의 가치를 파악한 다음 제출하십시오.jquery : 레이블 값 가져 오기

그러나 나는 그 일을 상당히 어렵게 생각합니다. 내가 여기서 뭘 잘못하고 있는거야?

$('#test').submit(function(e) { 
    if ($(this).children('.grab-label').val() == '') { 
     $(this).children('.grab-label').val($(this).closest('label')); 
    } 
}); 

안부 .children()help를 호출하여,

답변

4

먼저 매트 당신거야 루트 노드에서 직접 어린이 만 쿼리. 이 경우 직접 자식이 아니기 때문에 .grab-label을 찾을 수 없습니다.

.find()help을 사용하십시오. 또한 .closest()은 조회 상위 노드 만 지원합니다. 컨텍스트에서 그 이유 때문에 원하는 노드를 찾을 수 없습니다. input 노드에서 시작하여 .prev()help을 사용할 수 있습니다.

$('#test').submit(function(e) { 
    var $input = $(this).find('.grab-label'); 

    if (!$input.val().length) { 
     $input.val($input.prev().text()); 
    } 
}); 
3

closest 당신에게 조상을 제공합니다. 그러나 label은 입력란의 형제 인 입니다. .prev()을 사용하십시오. children은 모든 하위 항목이 아닌 DOM의 다음 단계에서만 검색합니다.

$(this).find('.grab-label').val($(this).prev('label').text()); 

(당신은 또한 .text() 필요)

를 또는로 HTML을 변경 : 대신 .find() 사용

<div class="input-inside-label"> 
    <label for="loc">12345 
     <input class="grab-label" value="" type="text" name="loc" id="loc"> 
    </label> 
</div> 

그러나 사용하기 쉬울 것 .parent() :

$(this).find('.grab-label').val($(this).parent().text()); 
1

을 받으려면 .html () 그 것으로부터 <label>

$('#test').submit(function(e) { 
    if ($(this).children('.grab-label').val() == '') { 
     $(this).children('.grab-label').val($(this).closest('label').html()); 
    } 
});