在做项目的过程中遇到要将form表单提交转为ajax方式提交，下面是我总结的如何把form表单提交无缝转为ajax方式提交的方法。

1. 将form元素的属性action、enctype、method去掉，添加id="form"，form元素就变为<form id="form">

2. 引入jquery库，<script src="jquery-1.8.2.min.js"></script>
   引入 jquery-1.8.2.min.js，右键选择“另存为”

3. 提交按钮增加 onclick="add_ajax()" 并把 type="submit" 修改为 type="button"
   例如：<input type="button" value="提 交" onclick="add_ajax()" />

4. 把ajax代码放在页面最底部（不能放在jquery库之前）

<script type="text/javascript">
function add_ajax(){
    $.ajax({
        type: "POST",
        url: "/plus/diy.php",//提交到后台文件
        data: $("#form").serialize(),//表单传值
        success: function(data) {
            alert(data);//弹窗显示PHP返回的值
            $("#deok").html(data);//以html的形式显示在指定id的元素里
            $("#form")[0].reset();//提交后清除表单填写的值
            $(this).val("");//清空上次input框里的数据
            $("#deok").val(aaa["boxnum"]);//向input框里写入新数据
        }
    });
    return false;
}
</script>

延伸阅读：
当表单的属性设置为"disabled"时，提交表单时，select的值无法传递，需要提交前移除disabled属性，使用$("#role").removeAttr("disabled");即可（提交前移除id="role"的disabled属性）

readonly属性和disabled的作用是一样的，他们之间有着细小的差别，readonly属性在提交时是可以传值的，而disabled则不能传值。