2012-10-11 5 views
0

제출 단추를 클릭하면 부모 요소의 배경색을 변경하려고합니다. 나는이 코드를 시도했다 그래서 위해jQuery를 사용하여 부모 요소의 배경색을 어떻게 변경합니까?

:

  $("input.submit").click(function(){ 
       var className = $(this).parent().attr("class"); 
       $(className).animate({backgroundColor: '#FFB95E'}, 1000); 
       $(className).animate({borderColor: '#C97200'}, 1000); 
      }); 

하지만 부모 요소의 클래스 이름을 얻을 수 없다. 다른 부모 요소가있는 제출 버튼이 몇 가지 있습니다. 그래서이 방법으로해야합니다.

아무도 도와 줄 수 있습니까?

많은 감사

피터

+0

제출 버튼의 클릭 이벤트는 약간 불안정합니다. 대신 양식 제출에 함수를 호출 해보십시오 ... – MassivePenguin

답변

1

마크 업의 예는이 문제를 해결하는 데 도움이되지만 올바른 코드를 사용하고있는 것 같습니다. 부모 요소

난 당신이 $(this).parent()[0]이 무엇인지보기 위해 불을 지르고 같은 디버거를 사용하거나 alert($(this).parent()[0]); 당신은 부모 요소가 방식을 볼 수 alert($(this).parent()[0].outerHTML);을 사용하게 할 경우 부모 요소가없는 것을 알고 "object"을 반환하지 않는 경우 제안 당신이 올바른 요소를 가지고 있다면.

마지막으로 $(className)은 중복되어 있으며 아래의 getter를 사용하여 elemnt 명령을 연결하거나 변수를 곧바로 jQuery 객체로 사용할 목적이 없습니다.

$(this).parent().animate({backgroundColor: '#FFB95E'}, 1000).animate({borderColor: '#C97200'}, 1000); 
+0

alert ($ (this) .parent() [0]을 사용할 때 정의되지 않았지만 클래스 이름이 "timer"인 부모 요소가 명확하게 있습니까? –

+0

'$ (this) .parents (": first") [0]'이 '이 DOM을 탐색하는 것에주의하십시오. 또한 컨텍스트의'this '객체가 생각하는 요소인지 확인하십시오. – DeMeNteD

0

이유는 단순히

$(this).parent() 
     .animate({backgroundColor: '#FFB95E', 
       borderColor: '#C97200'}, 1000); 

당신은 배경 색상을 설정하는 부모의 클래스를 얻을 필요가 없습니다. 그러나 색상에 애니메이션을 적용하지 않으면 기본적으로 전환 효과를 내기위한 플러그인이 필요합니다.

+0

나는 그에게 줄 것이다, 애니메이션 기능은 플러그인입니다. 감사합니다 :) –

관련 문제