AJAX 성공 부분에 .html 중에서 (결과를) 트리거 번 이상

Question

내 아약스 요청을 처리하기 위해 내 템플릿에이 코드는 (내가 전에 그것을 퍼팅 시도했지만, 그것은 도움이되지 않음)이 있습니다

<script> 
    $(document).ready(function() { 

     $("#send-mail-button").click(function(e){ 
      e.preventDefault(); 

      var nameVar  = $('#name').val(); 
      var emailVar  = $('#email').val(); 

      $.ajaxSetup({ cache: false }); 

      $.ajax({ 
        type: "POST", 
        url: "<?php echo base_url(); ?>form/send", 
        data: { name   : nameVar,      
          email   : emailVar 
         }, 
        success: function(result){ 
         $('#form').html(result); 
        } 

      }); 

      return false; 

     }); 


    }); 
</script> 

을

그리고 그것은 작동합니다. #form은 가정 한 결과의 html로 대체됩니다. 그러나, 내가 #send-mail-button를 다시 클릭하면. 아무 반응이 없습니다.

나는이에 코드를 변경하는 경우 :

<script> 
    $(document).ready(function() { 

     $("#send-mail-button").click(function(e){ 
      e.preventDefault(); 

      var nameVar  = $('#name').val(); 
      var emailVar  = $('#email').val(); 

      $.ajaxSetup({ cache: false }); 

      $.ajax({ 
        type: "POST", 
        url: "<?php echo base_url(); ?>form/send", 
        data: { name   : nameVar,      
          email   : emailVar 
         }, 
        success: function(result){ 
         alert(result); 
        } 

      }); 

      return false; 

     }); 


    }); 
</script> 

양식 HTML이 매번 팝업으로 경고한다. 나는 첫 번째 공식에 대해 동일한 템플릿을 사용하고 두 번째에 대해서도 동일한 템플릿을 사용하고 있습니다. 소스 코드를 확인한 결과 항상 동일합니다 (버튼을 클릭하기 전과 후에).

내 자바 스크립트에 어떤 문제가 있습니까?

UPDATE : 내 HTML :

양식의 콘텐츠를 교체 할 때 요소가 클릭 처리기가 파괴하기 때문에

<div id="form"> 

    <form action="" method="post" accept-charset="utf-8"> 

     <label for="name">Name</label> 
     <input type="text" name="name" id="name" /> 

     <label for="email">Email</label> 
     <input type="text" name="email" id="email" /> 

     <button type="button" id="send-mail-button">Send</button> 

    </form> 

</div> 

Answer 1

. 당신이 이벤트 위임 당신은 아마도`# 메일 발신 - button` 요소를 교체

$(document).ready(function() { 

    $("#form").on('click', '#send-mail-button', function (e) { 
     e.preventDefault(); 

     var nameVar = $('#name').val(); 
     var emailVar = $('#email').val(); 

     $.ajaxSetup({ 
      cache: false 
     }); 

     $.ajax({ 
      type: "POST", 
      url: "<?php echo base_url(); ?>form/send", 
      data: { 
       name: nameVar, 
       email: emailVar 
      }, 
      success: function (result) { 
       $('#form').html(result); 
      } 

     }); 

     return false; 

    }); 


});