Facebox 대화 상자 - jQuery 선택기가 입력 필드를 수정하지만 이벤트 트리거가 작동하지 않습니다.

Question

내 facebox 양식의 모든 브라우저에서 .change(), .click() 또는 .keydown() 트리거가 작동하지 않습니다.

- EDIT --- 문제는 facebox CLONES html이 대화 상자 요소에이를 표시하는 것입니다. 이 때문에 jquery 선택기는 작동하지만 이벤트 트리거는 복제본을 기반으로하지 않습니다. 해결 방법은 facebox를 수정하고 .clone() 비헤이비어를 제거하는 것입니다.

- END 편집 - 문서에

다음 작품 준비 :

#testE 텍스트 입력입니다

$('input#testE').css('background-color', 'red'); 

. 로드시 텍스트 상자 배경이 빨간색입니다. 그러나 ...

$('input#testE').keydown(function() { 
    $('input#testE').css('background-color', 'red'); 
}); 

트리거되지 않습니다. 나는 또한 .change()과 .click()을 시도했다. 테스트를 위해 콘솔에 출력하지도 않습니다. 내 코드는 jsFiddle에서 제대로 작동하지만 내 환경에서는 작동하지 않습니다. 이것에 대한 어떤 생각?

편집 ....

문서 준비 문제에 대해 명확히하기 :

$(document).ready(function() { //on document load 

     console.log('test'); // this works 

     $('input#testE').keydown(function() { //won't fire 
      $('input#testE').css('background-color', 'red'); 
     }); 


        $('input#testE').css('background-color', 'blue'); //works 
      }); 

Answer 1

와

$(this).prop('id') 

를 교체하십시오, 당신은 이미 문서에 존재하는 형태의 복사본을 만들고 그것을 표시합니다.

양식을 복사 할 때 현재 인라인 스타일 (노란색)을 사용하지만 이벤트 처리기를 사용하지 마십시오.

#req_acct을 display: block으로 변경하면 원래 양식을보고 색상이 변경된 것을 볼 수 있습니다.

Answer 2

난 당신이 요소를 클릭하지 않는 것을 의심은 당신이 실제로 원하는 .. 이 원인 일 수 있습니다 두 가지 요소가 겹치는 페이지에 CSS가 있습니다. (절대 위치 지정 또는 다른 것, CSS에 대해 많이 알지 못합니다.)

다음 방법을 사용하여 확인할 수 있습니다.

$('*').click(function(){ 
    console.log($(this).prop('id')); 
}); 

그리고 입력란을 클릭하고 올바른 ID인지 확인하십시오. jquery가로드 되었다면 (이것은 당신이 증명했듯이) 확실히 작동합니다.

는

편집 :

.prop가 작동하지 않는 경우, 당신은 아마 JQuery와의 이전 버전을 가지고있다. 소품 대신에 attr을 사용해야합니다. 당신이 "요청에게 계정"버튼을 클릭하면 그래서

$(this).attr('id')