2010-02-05 2 views
1

나는 이틀 동안이 일을 해왔다. 기본적으로 JQuery Cookbook 모달을 처음부터 사용하고 있습니다. 내 문제는 HTML 페이지가 잘로드되는 양식이지만 코드가 제출 단추를 인식하지 못합니다. 여기에 코드의 관련 부분입니다 :Jquery Cookbook 모달 버튼

별도의 HTML : 당신이하려고하는 것을 의미한다

// Insert modal at end of </body>. 
$('body').append('<div id="modal_wrapper"><!--[if IE 6]><iframe id="modal_iframe" frameborder="0"></iframe><![endif]--><div id="modal_overlay"></div><div id="modal_window"><div id="modal_bar"><strong>Modal window</strong><a href="#" id="modal_close">Close</a></div><div id="modal_content"><div id="contact"><form><p><input id="firstname" /></p><p><input id="register" /></p></form></div></div></div>'); 

$('#modal_content').load('mediaKitF.html#contact'.replace('#', ' #'), '', showModal); 

$("input[type=text]").focus(function(){ 
    // Select field contents 
    this.select(); 
}); 

$('input #firstname').focus(); 

$('#register').click(function() { 
    alert("hello there"); 
}); 
+0

'인식하지 못합니다.'라는게 무슨 뜻입니까? 어떻게됩니까? 페이지에 렌더링되지 않습니까? 제출하지 않습니까? –

+0

모달에서 #register 버튼을 클릭해도 아무런 반응이 없습니다. 등록 단추는 실제로 외부 페이지의 HTML이며 상위 페이지는 아닙니다. – bGood

답변

0

$('#modal_content').load()는 비동기 방식입니다 :

<div id="contact"> 
    <form action="" id="register_form" method="post"> 
    <p>First Name <br /> 
     <input type="text" id="firstname" name="firstname" /></p> 
    <p>Last Name <br /> 
     <input type="text" id="lastname" name="lastname" /></p> 
    <p>Username: <span class="micro">Must be a valid email address</span></span><br /> 
     <input type="text" id="username" name="username" /></p> 
    <p><input type="submit" value="Register" id="register" /></p> 
    </form> 
</div> 

여기 모달 코드의 관련 부분입니다 새 콘텐츠를 받기 전에 클릭 이벤트를 $('#register') 요소에 첨부하십시오. $('#register').live('click', function() {})을 사용하거나 클릭 핸들러를 첨부 한 코드를 showModal 함수로 이동해야합니다.

+0

그것이 황금의 화살이 아니라면 - 매력처럼 작동했습니다! 이 금요일에 수천명과 하나 감사합니다! – bGood