с помощью ajax для отправки формы?

Question

Мой HTML-код:

<?php echo form_open('question/submit', $attributes_form) 

       <div style="margin-top:15px;" class="control-group"> 
        <div class="controls"> 
         <button type="submit" class="btn btn-success" id="post-question">提交问题</button> 
         <div id="#loading"></div> 
        </div> 
       </div> 
      <?php echo form_close();?> 

Мой код запроса:

<script type="text/javascript"> 
$(function() 
{ 
    $('#post-question').click(function() 
    { 
     alert('hello world'); 
    }); 

    $('#question').submit(function() 
    { 
     $.ajax({ 
     url:"<?php echo base_url('question/submit');?>", 
     type:post, 
     beforeSend:function(event){ 
      $('#loading').html("<img src='<?php echo base_url('assets/img/loading.gif');?>'>"); 
     }, 
     success:function(data){ 
      alert("Success:" + data.result); 
      $('#loading').empty(); 
     }, 
     error:function(data){ 
      $('#loading').empty(); 
      $('#loading').val("提交出错，请重试"); 
     }, 
     }); 
    }); 
}); 
</script> 

Когда я нажимаю кнопку отправки, страница перенаправляется на вопрос/отправить, почему? Поскольку я использую пост ajax, я думаю, что страница не должна обновляться или перенаправляться.

Answer 1

Вы не предотвратили действие по умолчанию события, которое должно представить в виде (очевидно):

$('#question').submit(function(event) { 
    event.preventDefault(); 
    // ... 
}); 

Answer 2

Вы должны вызвать .preventDefault() на мероприятии представить.

$('#question').submit(function (e) { 
    e.preventDefault(); 
    $.ajax({ 
     data: $(this).serializeArray(), 
     url:"<?php echo base_url('question/submit');?>", 
     type: 'POST', 
     beforeSend:function(event){ 
      $('#loading').html("<img src='<?php echo base_url('assets/img/loading.gif');?>'>"); 
     }, 
     success:function(data){ 
      alert("Success:" + data.result); 
      $('#loading').empty(); 
     }, 
     error:function(data){ 
      $('#loading').empty(); 
      $('#loading').val("提交出错，请重试"); 
     } 
    }); 
}); 

Answer 3

вы будете хотеть, чтобы вызвать метод event.preventDefault(), чтобы перехватить более типичное представление формы HTML/пост, так как вы используете этот подход АЯКС