zoukankan      html  css  js  c++  java
  • JQuery

    [JavaScript] JQuery异步提交表单与文件上传
    Jquery.form.js是一个可以异步提交表单及上传文件的插件。
    文档地址:http://jquery.malsup.com/form/
    
    index.html
    
    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta charset="utf-8">
        <script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.form.js"></script>
        <script type="text/javascript" language="javascript">
            $(function(){
                //异步提交表单
                $("#ajaxSubmit").on("click",function(){
                    console.log($(this));
                    $("#formToUpdate").ajaxSubmit({
                        type:'post',
                        url:'p.php',
                        success:function(data){
                            console.log(data);
                        },
                        error:function(XmlHttpRequest,textStatus,errorThrown){
                            console.log(XmlHttpRequest);
                            console.log(textStatus);
                            console.log(errorThrown);
                        }
                    });
                });
            });
        </script>
    </head>
    <body>
    
    <form id="formToUpdate" method="post" action="#" enctype="multipart/form-data">
        <input type="text" name="t1"><br />
        <input type="file" name="f1"><br />
        <input id="ajaxSubmit" type="button" value="异步提交">
    </form>
    
    </body>
    </html>
    
    p.php
    
    <?php
    /**
     * Created by JetBrains PhpStorm.
     * User: smeoi
     * Date: 13-11-11
     * Time: 下午12:35
     * To change this template use File | Settings | File Templates.
     */
    
    echo '<pre>';
    print_r($_POST);
    echo '</pre>';
    
    echo '<pre>';
    print_r($_FILES);
    echo '</pre>';
    
  • 相关阅读:
    LG P2473 [SCOI2008]奖励关
    三分法
    P2521 [HAOI2011]防线修建
    金融分析-ipython
    vue --webpack的使用
    Vue-npm命令解析
    Vue-router VUE路由系统
    爬虫--总目录
    爬虫-scrapy框架
    爬虫-性能相关- twisted-tornado
  • 原文地址:https://www.cnblogs.com/KTblog/p/5009793.html
Copyright © 2011-2022 走看看