2013-02-08 3 views
0

페이지에 여러 폼이 있습니다. 각 폼에는 유효성 검사 오류를 표시하는 "메시지 상자"가 있습니다. 각 "메시지 상자"에는 닫기 버튼이 있습니다. 닫기 버튼을 "메시지 상자"를 닫는 데 아무런 문제가 없지만 잘못된 텍스트 입력에서 클래스 "오류"를 제거해야합니다. 페이지 내용은 ajax에 의해 가져옵니다. 따라서 ".on"DOM 트래버스 및 클래스 제거

가짜 HTML (메시지 상자와 닫기 버튼이 포함 된 자체 양식 태그에 모두 8 개가 래핑 된 것을 기억하십시오.

$(this).parents('form').find('input.error').removeClass('error'); 

을하지만 원하는 경우 :

<form action="#" method="post" id="Form6"> 
    <ul> 
     <li> 
      <label for="foo">label</label> 
      <input type="text" name="foo" id="foo"> 
      <input type="submit" id="Button6" value="submit" /> 
     </li> 
    </ul> 
    <div id="Msg6" class="error"><a class="close">X</a><ul></ul></div> 
</form> 

내 시도

$('body').on('click', 'a.close', function(){ 
    $(this).parent().fadeOut("fast"); 
    $(this).closest('input[type="text"].error').removeClass('error'); // doesn't work 
    $('a.close').closest('ul > li > input.error').remove();// doesn't work 
    //console.log($.closest('input[type="text"].error'));//tring to log the value of the ancestor 
}); 

답변

1

이 작업을해야합니다 그것을 제거하려면, 클래스를 변경하지 않아도됩니다, 그냥 .remove() ...

+0

을 사용하십시오. 그래서 부모 폼으로 DOM을 트래버스 한 다음 input.error와 removeClass를 찾으십시오. 수업은 배웠습니다. 기준선을 얻기 위해 제거를 사용하는 것만으로도 수업을 삭제할 수 있습니다. –

+0

네, 그렇지만'parents '대신'closest'를 사용할 수도 있습니다. 나는 closest()가 일치가 발견 될 때까지 backwars를 돌아 다니고'parents()'는 모든 부모를 모으고 일치하는 것을 찾을 것이기 때문에 더 빠르다고 생각한다. –