Question

form表单提交跳转页面的问题。我用的PHP+Mysql做的，这是表单代码，想做一个ajax提交。

表单我是做在首页的，只需要提交数据而不想让他提交后跳转到php页面，有没有大神帮忙看看？我就想要个简单的提交数据不跳转页面，这样就OK了！分不多，还请大神能热心帮助一下，万分感谢！
上面图片弄错了 不好意思





Answer 1

首先在body中引入jquery,如下：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

然后建立script

<script>
$(document).ready(function(){ 
$("#subper").click(function(event) {
  event.preventDefault();//禁止使用submit 提交数据，因为我们要用ajax啊
var checkbox  = new Array();//建立数组收集checkbox的选中值
$('input[name="checkbox[]"]:checked').each(function(){ //在这里使用checkbox[]命名收集checkbox的值其实没什么意义了
 
    checkbox.push($(this).val());//向数组中添加元素 
 
});
 var data = { //收集传递的参数，以json的形式
     checkbox:checkbox,
     as:$("input:radio[name='as']:checked").val(),
     username: $('input[name="username"]).val(),
     .
     .//自己补充后面的
     .
  };

  $.ajax({
    type:'POST',
    data:data,
    dataType: "json",
    url:$("form").attr('action'),
    success: function(msg){
        $('.answer').html(msg);//如果没有class=answer，这里没有任何效果
    }    
  });
});
});
</script>

需要注意的是，在php 服务器端，记得把json的数据转换成php格式的,使用json_decode($json, true)，就可以得到一个大数组，用这个大数组进行下面的php活动。因此你需要对服务器端的代码做一些小小的修改。

Answer 2

<form name="" method="post" action="/test.php" id="login">
    <input type="text" class="form-control" name="username" placeholder="用户名或邮箱" />
    <input type="password" class="form-control" name="password" placeholder="密码" />
    <input type="text" class="form-control" name="verify" placeholder="验证码" autocomplete="off" />
    <input type="submit" class="btn btn-primary btn-block" value="登录">
</form>

<script type="text/javascript">
$("#login").submit(function(){
    var self = $(this);
    $.post(self.attr("action"), self.serialize(), success, "json");
    return false;
    function success(data){
    	if(data.status){
			alert('OK');
    	} else {
    		slert('NO');
    	}
    }
});
</script>

像这样！