使用formData给后台提交表单数据

来源：互联网发布：osi的七层网络结构图编辑：程序博客网时间：2024/05/20 08:22

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><html> <head>  <meta http-equiv="content-type" content="text/html; charset=utf-8">  <title> FormData Demo </title> </head> <body>    <form name="form1" id="form1">        <p>name:<input type="text" name="name" ></p>        <p>gender:<input type="radio" name="gender" value="1">male <input type="radio" name="gender" value="2">female</p>        <p>photo:<input type="file" name="photo" id="photo"></p>        <p><input type="button" name="b1" value="submit" onclick="fsubmit()"></p>    </form>    <div id="result"></div> </body>   <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>  <script type="text/javascript">    function fsubmit(){        var data = new FormData($('#form1')[0]);        ----------------------------------------        $.ajax({            url: 'server.php',            type: 'POST',            data: data,            -----------            dataType: 'JSON',            cache: false,            processData: false,            contentType: false        }).done(function(ret){            if(ret['isSuccess']){                var result = '';                result += 'name=' + ret['name'] + '<br>';                result += 'gender=' + ret['gender'] + '<br>';                result += '<img src="' + ret['photo']  + '" width="100">';                $('#result').html(result);            }else{                alert('提交失敗');            }        });        return false;    }  </script></html>

tips : 获取form对象，作为参数传入formData中，然后ajax请求的时候传给后台，关键代码我已经用横线标出

阅读全文

0 0