前端和后端的数据交互之 form表单

最新推荐文章于 2024-05-05 05:31:57 发布

咩有猫腻.

最新推荐文章于 2024-05-05 05:31:57 发布

阅读量5.4k

点赞数 3

分类专栏：前端后端

本文链接：https://blog.csdn.net/DcTbnk/article/details/105648705

版权

前端后端专栏收录该内容

45 篇文章 0 订阅

订阅专栏

在这里插入图片描述

一.html

<body>
<!-- 通过form表单向后台数据库发送数据 
        form表单的设定---属性
            action:传参的对象文件---传参给一个PHP文件
            method:传参的方式 get post
            enctype:专门设定上传文件方式的属性
                    有文件需要上传时,传参方式,必须是post
                    enctype="multipart/form-data"
                    
        form表单中,标签的设定
            form表单中,标签要传参,必须有name属性
            前端标签的name属性,是存储参数数据的键名(也可以理解为容器名称/变量名称)
            标签中的数据信息,也要有一个容器来存储,标签的name属性值,就是这个容器,来存储标签的数据
            也可以通俗的理解,name属性值,就是变量的变量名称

            标签的数据,就是变量的数值
                text,password,textarea,number,url等可以通过输入,输入数据
                                                也可以通过value属性,设定数据
                                                也可以通过JavaScript,标签.value来设定,获取数据
                file,select,可以通过点击选取数据,也可以通过value属性,设定数据,也可以通过JavaScript, 标签.value 来设定,获取数据

                checkbox,radio,hidden,只能通过value属性,设定数据,也可以通过JavaScript, 标签.value 来设定,获取数据

            问题1: 如果标签,name相同,value不同,要给name属性值后添加[]
                    可以实现同时传递所有的参数,而不是只传参最后一个参数
                    不加[],是等于对一个变量,重复赋值,后赋值的数据会覆盖之前的数据
                    有[] ,是以数组的形式,存储多个数据

            问题2: 上传文件
                    上传文件,PHP要接收到所有的上传文件数据信息,必须要做form表单标签的设定
                    1,设定 method 传参方式为 post
                    2,设定 enctype="multipart/form-data"
                    PHP中,使用专门的接收上传文件的变量 $_FILES 传参上传文件的所有信息

            问题3: 多文件上传
                    1,多个input--file标签,name属性值添加[]
                    2,给input--flee标签,添加多选属性multiple,name属性值添加[]
--> 
<form action="./02_demo.php" method="post" enctype="multipart/form-data">
    账号: <input type="text" value="jack" name="username" placeholder="请输入账号"><br>  
    密码: <input type="password" value="123456" name="userpwd" placeholder="请输入账号"><br>  
    性别: 男<input type="radio" name="sex" value="男"> 
            女<input type="radio"  name="sex" value="女"> 
            保密<input type="radio"  name="sex" value="保密"><br>
    爱好: 英雄联盟 <input type="checkbox" name="hobby[]" value="英雄联盟">
            王者荣耀 <input type="checkbox" name="hobby[]" value="王者荣耀">
            绝地求生 <input type="checkbox" name="hobby[]" value="绝地求生">
            魔兽世界 <input type="checkbox" name="hobby[]" value="魔兽世界"><br>
    头像: <input type="file" name="file[]" multiple><br>
    城市<select name="city">
        <option value="北京">北京</option>
        <option value="上海">上海</option>
        <option value="广州">广州</option>
        <option value="重庆">重庆</option>
        <option value="天津">天津</option>
    </select><br>
    <button>传参</button>
    </form>
</body>

二.php

<?php

// PHP 中有专门的接收前端参数的方式
// $_GET   专门用于接收前端get方式传参的所有数据
//         以数组的形式存储
// $_POST  专门用于接收前端post方式传参的所有数据
//         以数组的形式存储
// $_FILES 专门存储上传文件相关数据
//         以数组的形式存储
//         


// echo '<pre>';
// print_r($_GET);
// echo '</pre>';

echo '<pre>';
print_r($_POST);
echo '</pre>';


echo '<pre>';
print_r($_FILES);
echo '</pre>';

咩有猫腻.

关注

3
点赞
踩
27

收藏

觉得还不错? 一键收藏
0
评论
前端和后端的数据交互之 form表单

一.html<body><!-- 通过form表单向后台数据库发送数据 form表单的设定---属性 action:传参的对象文件---传参给一个PHP文件 method:传参的方式 get post enctype:专门设定上传文件方式的属性有...
复制链接

扫一扫

专栏目录