使用ajax提交表单有很多优势（下面是一个上传文件的实例 new FormData class）

来源：互联网发布：好的莆田鞋淘宝店编辑：程序博客网时间：2024/05/19 13:22

<!DOCTYPE html><html><head>    <include file="Common@Public/head" />    <!-- Include Required Prerequisites -->    <script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>    <script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" /></head><body><include file="Common@Public/dhb_info" /><include file="Common@Public/header" /><div class="panel panel-default">    <div class="panel-body">        <form class="form-horizontal" action="{:U('TagBatch/batchHandle')}" id="tel_tag_form">            <div class="form-group">                <label class="col-sm-2 control-label" style="margin-right:16px;">号码</label>                <input type="file" name="tel_list"/>            </div>            <div class="form-group">                <label class="col-sm-2 control-label">标签</label>                <div class="col-sm-5">                    <select class="form-control" name="itag_id">                        <foreach name="tag_list"  item="vo">                            <option value="<?php  echo $vo['id']?>" ><?php  echo $vo['itag']?></option>                        </foreach>                    </select>                </div>            </div>            <div class="form-group" data-toggle="buttons">                <label class="col-sm-2 control-label" style="margin-right:15px;">操作</label>                <label class="btn btn-primary active" style="margin-right:40px;">                    <input type="radio" name="handle_type" id="option1" value="up_line" checked>上线                </label>                <label class="btn btn-primary ">                    <input type="radio" name="handle_type" id="option2" value="down_line">下线                </label>            </div>            <div class="form-group">                <div class="col-sm-offset-2 col-sm-10">                    <button id="smt" type="submit" style="width:50%" class="btn btn-primary  btn-block">上传</button>                </div>            </div>        </form>    </div></div></div><script type="text/javascript">    $(document).ready(function(){        $("#tel_tag_form").submit(function(){            console.log('form submit start');            event.preventDefault();            var formData = new FormData($(this)[0]);            $.ajax({                url: $(this).attr("action"),                type: 'POST',                data: formData,                async: false,                cache: false,                contentType: false,                processData: false,                success: function (returndata) {                    alert(returndata);                }            });        });    });</script></body></html>

阅读全文

0 0

使用ajax提交表单有很多优势 （下面是一个上传文件的实例 new FormData class）

使用ajax提交表单有很多优势（下面是一个上传文件的实例 new FormData class）