jQuery를 사용하여 레일 파츠 토글

Question

필자는 레일즈 애플리케이션에서 jQuery를 사용하여 버튼 클릭시 두 개의 부분을 기본적으로 전환하려고합니다. 원하는 동작은 다음과 같습니다. 페이지는 사용자 프로필과 '프로필 편집'버튼으로 렌더링됩니다. 프로파일 부분의 '프로파일 편집'버튼을 클릭하면 부분이 DOM에서 제거되고 프로파일 편집 부분이 렌더링됩니다. 편집 프로필 부분의 '저장'버튼을 클릭하면 작업이 취소되고 사용자 프로필이 다시 표시됩니다. 내가 jQuery를 새로운 해요,하지만 난 다음 스크립트에 도착 유래의 도움으로 다음과

<script language="javascript" type="text/javascript"> 
    jQuery(
    function editProfile($) { 
     $('#edit').click(function() { 
     $("#edit-profile").html('<%= escape_javascript(render :partial => "shared/edit_profile").html_safe %>'); 
     $("#show-profile").empty(); 
     }); 
    } 
); 

    jQuery(
    function showProfile($) { 
     $('#save').click(function() { 
     $("#show-profile").html('<%= escape_javascript(render :partial => "shared/show_profile").html_safe %>'); 
     $("#edit-profile").empty(); 
     }); 
    } 
); 
</script> 

내 html.erb가 될 때 :

<div id="show-profile"> 
    <%= render :partial => "shared/show_profile" %> 
</div> 
<div id="edit-profile"></div> 

내가 가진 문제는 내가 할 수있는 것입니다 하나의 함수 만 실행하는 것처럼 보입니다 (즉, 페이지가로드되고 편집하려면 전환 할 수 있지만 뒤로는 전환 할 수 없음). 모든 지침을 부탁드립니다.

Answer 1

jQuery를 버전에 따라 사용해야

전 1.7 :$('#save').live('click', function(){...})

1.7 이상 :$('#save').on('click', function(){...})

그리고 #edit에 대해 동일합니다. 한마디로

What is the difference between the bind and live methods in jQuery?

: .bind()는 단지 당신이 현재의 jQuery 객체에서 선택한 항목에 적용됩니다. .live()는 현재 일치하는 모든 요소와 앞으로 추가 할 요소에 모두 적용됩니다.