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

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

2025-03-31 08:57:06 阅读次数：10

<!DOCTYPE html>
<html>
<head>
    <include file="Common@Public/head" />
    <!-- Include Required Prerequisites -->
    <script type="text/javascript" src="///jquery/1/jquery.min.js"></script>
    <script type="text/javascript" src="///momentjs/latest/moment.min.js"></script>
    <link rel="stylesheet" type="text/css" href="///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 = $(this).serialize();
            $.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>

版权声明：本文内容来自第三方投稿或授权转载，原文地址：https://blog.csdn.net/cominglately/article/details/76201342，作者：cominglately，版权归原作者所有。本网站转在其作品的目的在于传递更多信息，不拥有版权，亦不承担相应法律责任。如因作品内容、版权等问题需要同本网站联系，请发邮件至ctyunbbs@chinatelecom.cn沟通。

活动

智算服务

应用商城

合作伙伴

开发者

支持与服务

了解天翼云

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

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

相关文章

【Java】类与对象简介

django从入门到实战(三)——CBV视图介绍

django从入门到精通（五）——表单与模型

CSS定义变量

初学Java,jar命令详解(二十四)

初学Java,内部类(十九)

初学Java,IO之File用法(三十九)

31天Python入门——第25天:文件和目录操作

Java反射学习(1)(Java的“反射“机制、Class类对象的实例化方式)

javascript-自定义对象-数组形态对象-字典形态对象

作者介绍

最新文章

django从入门到实战(三)——CBV视图介绍

java.lang.UnsupportedClassVersionError: org/springframework/boot/maven/RepackageMojo has been compil

HTML表格、表单标签

lumen5.5 鉴权dusterio/lumen-passport

java知识点总结（二）

快速上手 Vue 3 的高效组件库Element Plus

热门文章

Jsp Ajax之模拟用户注册

ajax2-ajax的post请求

处理器方法的返回值

Content type ‘application/x-www-form-urlencoded；charset=UTF-8‘ not supported错误的多种解决方法及说明Content-Type

layui表单基本使用

ajax函数

热门标签

相关产品

弹性云主机

天翼云电脑（公众版）

对象存储

云硬盘

随机文章

layui结合ajax实现下拉联动效果

Django Ajax发送请求使用方法

表单2

HTML表格、表单标签

表单的初级验证

CSSS 实现图片自适应容器展示

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

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