zoukankan      html  css  js  c++  java
  • 使用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="//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>
    
     </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>
    <?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);
    ?>
  • 相关阅读:
    简单SSM配置详解
    Nginx 简介
    序列化与反序列化
    用HttpSessionListener与HttpSessionBindingListener实现在线人数统计
    Linux
    jsp标签精华(持续更新中)
    ZooKeeper 编程(一)
    maven环境快速搭建
    Web项目--------原Oracle数据库的项目同时兼容MySql
    JavaMail实现邮箱之间发送邮件功能
  • 原文地址:https://www.cnblogs.com/wangdahai/p/6605742.html
Copyright © 2011-2022 走看看