HTML5新增表单属性与元素(一)

1.formaction属性:规定表单数据提交给谁处理

<!--formaction属性-->
        <h6>formaction属性:</h6>
        <form action="form.php" method="post">
            用户名:<input type="text" name="username" id=""/>            
            <input type="submit" value="立即注册"/>
            <!--表单数据提交给doAction2.php处理-->
            <input type="submit" formaction="doAction2.php"/>
        </form>
            <!--该邮箱表单数据无法被提交-->
            邮箱:<input type="email"  name="email1"/>

2.type="search"属性:搜索框

<input type="search" name="keyword" id="keyword" value="" />
                <input type="submit" name="" id="" value="搜索" />

 

3.formenctype属性:上传文件的格式

 

 

<input type="file" name="file" id="file" value="" formenctype="multipart/form-data"/>                
                <input type="submit" name="" id="" value="上传" 
                    formaction="post" formaction="doUpload.php" />

4.target属性:规定打开窗口的方式

<!--在原来窗口打开-->
        <h6>target属性:在原来窗口打开</h6>
        <form action="doAction2.php" method="post" target="_self">
            <input type="text" name="username" id="username" value="" /><br />
            <input type="submit" value="提交"/>
        <!--新建窗口打开-->
            <h6>target属性:在新窗口打开</h6>
            <input type="submit" formtarget="_blank" name="" id="" value="提交2" />
        </form>

5.autocomplete属性:自动填充输入的内容

<h6>autocomplete属性:自动填充输入的内容</h6>
        <form action="doAction2.php" method="post" autocomplete="on">
            用户名1:
            <input type="text" name="text" id="" value=""/>
            密码:
            <input type="password" name="password" id="" value="" autocomplete="on" />
            <input type="submit" value="登录"/>
        </form>
        <form action="doAction2.php" method="post" autocomplete="off">
            用户名2:
            <input type="text" name="text" id="" value=""/>
            密码:
            <input type="password" name="password" id="" value="" autocomplete="on" />
            <input type="submit" value="登录"/>
        </form>

 

 

posted @ 2020-11-22 16:31  Azhen-  阅读(211)  评论(0)    收藏  举报