HTML5表单提交和PHP环境搭建

1. HTML5表单的创建

HTML表单
1.表单用于不同类型的用户输入
2.常用表单标签:
    <form>          表单
    <input>         输入域
    <textarea>      文本域
    <label>         控制标签
    <fieldset>      定义域
    <legend>        域的标题
    <select>        选择列表
    <optgroup>      选择组
    <option>        下拉列表中的选项
    <button>        按钮
3.常用
    复选框
    单选按钮
    下拉列表
    文本域
    创建按钮

     <form>
        用户名:
        <input type="text">
        <br>
        密码:
        <input type="password">
        <br>
        你喜欢的水果?(复选)<br>
        APPLE<input type="checkbox">
        BANANA<input type="checkbox">
        PEAR<input type="checkbox"><br>
        性别(单选)<br>
        男<input type="radio" name="sex" checked>
        女<input type="radio" name="sex">
        <br>
        选择m*(下拉列表)
        <select>
            <option>m1</option>
            <option>m2</option>
            <option>m3</option>
            <option selected>mm</option><!--默认-->
        </select>
        <br>
        <input type="button" value="按钮">
        <input type="submit"><!--默认文字不同浏览器不同,测试IE10为"提交查询内容",Chrome为提交-->
    </form>
   <textarea cols="30" rows="10">文本域,cols行,rows列</textarea>

2. PHP环境搭建

可以用PHPStorm配置,也可以用xampp启动Apache

对于工作空间在/xampp/htdocs下的,如E:\xampp\htdocs\PHPTEST\service.php

可以用PHPStorm直接访问获得访问地址,如http://localhost:63343/htdocs/PHPTEST/service.php

也可以用Apache开启服务后的访问地址,如http://localhost/PHPTEST/service.php

3. HTML5表单与PHP交互

最简单的表单,采用get方式提交,action是PHPStorm得到的:

<form action="http://localhost:63343/htdocs/PHPTEST/service.php" method="get">
        用户名:
        <input type="text" name="Tname">
        <br>
        密码:
        <input type="password" name="Tpassword">
        <br>
        <input type="submit" value="提交">
    </form>

服务端:

<?php

echo 'GET方式可以做资源定位,如淘宝商品用id定位<br>用户名:'.$_GET['Tname'].'<br>密码:'.$_GET['Tpassword'];

 

第二种方式,用Apache的服务,post方式提交:

 <form action="http://localhost/PHPTEST/service.php" method="post">
        用户名:
        <input type="text" name="Tname">
        <br>
        密码:
        <input type="password" name="Tpassword">
        <br>
        <input type="submit" value="提交">
    </form>

服务端:

<?php

echo 'POST方式较为安全<br>用户名:'.$_POST['Tname'].'<br>密码:'.$_POST['Tpassword'];