2

我有一个表单（通过codeigniter 制作），我想用ajax onClick 提交。没有 Ajax 的表单提交并且不让我做event.preventDefault();

jQuery 文件

$('#register_submit').click(function(e){//
   e.preventDefault();
    var first_name = $('#register_form1').val();


    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    }); 

});

// 控制器工作得很好。名称寄存器，我发布到的功能是registration_val

HTML 文件 

 <form method="POST" action='<?php echo site_url('/register/registration_val'); ?>' id='register_form' >
   <input type="login" name="register_first_name" id="register_form1">
   <input type='submit' value="Register" id='register_submit'>
 </form>

问题是，当我单击 SUBMIT 按钮时，jQuery 不做它的工作，而是将自己提交给控制器并发出错误消息。
我无法阻止表单提交（我认为这可以解决问题），Click 事件被完全忽略。提前致谢

4

2 回答 2

7

试试你的运气，submit而不是click：

$('form').submit(function(e){//
   e.preventDefault();
    var first_name = $('#register_form1').val();


    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    });     
});

如果 fromid替换'form'为'#{formId}'.

笔记：

  • 代码应该在 DOM 就绪事件回调中。
  • 如果 DOM 上不存在表单，则应使用委托事件。

像这样：

$('body').on('submit', 'form', function(e){
   e.preventDefault();
    var first_name = $('#register_form1').val();    

    $.ajax({
        type: "POST", 
        async: false, 
        url: base_url+"register/registration_val",   
        data: "register_first_name="+first_name,
        success: function(data){
            $('#inferiz').html(data);
        },
        error: function(){alert('error');}
    });     
});

只需body用更接近的静态元素（如果有的话）替换以提高性能。

祝你好运！

于 2012-05-01T22:09:29.603 回答
0

如果您将return false;点击事件结束，它不应该将您的表单提交给控制器..

于 2012-12-22T09:25:39.680 回答