网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的范文：

　

标题 php+html5使用FormData对象提交表单及上传图片的方法
范文
    这篇文章主要介绍了php+html5使用FormData对象提交表单及上传图片的方法,实例分析了FormData对象的使用技巧,非常具有实用价值,需要的朋友可以参考下
    代码如下:
    代码如下:
    本文实例讲述了php+html5使用FormData对象提交表单及上传图片的方法。分享给大家供大家参考。具体分析如下：
    FormData 对象，可以把form中所有表单元素的name与value组成一个queryString，提交到后台。在使用Ajax提交时，使用FormData对象可以减少拼接queryString的工作量。
    使用FormData对象
    1.创建一个FormData空对象，然后使用append方法添加key/value
    代码如下:
    var formdata = new FormData();
    formdata.append('name','fdipzone');
    formdata.append('gender','male');
    代码如下:
    2.取得form对象，作为参数传入到FormData对象
    代码如下:
    <form name="form1" id="form1">
    <input type="text" name="name" value="fdipzone">
    <input type="text" name="gender" value="male">
    </form>
    代码如下:
    var form = document.getElementById('form1');
    var formdata = new FormData(form);
    代码如下:
    使用FormData提交表单及上传文件：
    代码如下:
    代码如下:
    <!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>
    <script src="/js/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>
    </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>
    </html>
    代码如下:
    server.php如下：
    代码如下:
    <?php
    $name = isset($_POST['name'])? $_POST['name'] : '';
    $gender = isset($_POST['gender'])? $_POST['gender'] : '';
    $filename = time().substr($_FILES['photo']['name'], strrpos($_FILES['photo']['name'],'.'));
    $response = array();
    if(move_uploaded_file($_FILES['photo']['tmp_name'], $filename)){
    $response['isSuccess'] = true;
    $response['name'] = $name;
    $response['gender'] = $gender;
    $response['photo'] = $filename;
    }else{
    $response['isSuccess'] = false;
    }
    echo json_encode($response);
    ?>
    代码如下:
    运行效果如下图所示：
    名单
    希望本文所述对大家的php程序设计有所帮助。
随便看

　

在线学习网范文大全提供好词好句、学习总结、工作总结、演讲稿等写作素材及范文模板，是学习及工作的有利工具。

　

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间：2025/5/13 6:12:54