合肥Web培训
达内合肥web培训中心

0551-64632511

热门课程

“搭顺风车”的表单元素

  • 时间:2016-05-19
  • 发布:合肥web培训
  • 来源:达内新闻

对于表单元素,除了reset元素,只要有name与value都能提交

一般来说,那些能选择的,能填空的,就是我们要提交的。但浏览器还提供一种机制,让我们能让除了用户自己添加的东西外,还能偷偷地提交“额外”的东西。

合肥达内web培训专家指出, 这些搭顺风车的包括了3种:input[type=hidden],input[type=submit],input[type=image]

我们可以看一下表。

XHTML<!DOCTYPE html>
<html>
    <head>
        <title>合肥达内</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>

        <form url="/">
            <fieldset><legend>hidden+submit</legend>
                <input type="hidden" name="aaa" value="eee"/>
                <input type="reset" name="test" value="ooo" >

                <input type="submit" name="submit" value="xxx"/>
            </fieldset>
        </form>
        <form url="/">
            <fieldset><legend>hidden+image</legend>
                <input type="hidden" name="bbb" value="eee"/>
                <input type="reset" name="test" value="ooo" >
                <button type="button" name="ccc" value="ddd">btn</button>
                <input type="image" name="submit" value="yyy"/>
            </fieldset>
        </form>
        <form url="/">
            <fieldset><legend>hidden+button</legend>
                <input type="hidden"  name="ccc" value="eee"/>
                <input type="reset" name="test" value="ooo" >
                <button name="submit" value="zzz" >xxx</button>
            </fieldset>
        </form>
        <form url="/">
            <fieldset><legend>hidden+reset</legend>
                <input type="hidden"  name="ccc" value="eee"/>
                <input type="reset" name="submit" value="ooo" >
            </fieldset>
        </form>
    </body>
</html>


我们一一点击,就知道发现什么回事了。

隐藏域就不用说了,它肯定会提交。

submit按扭会携带其自身的name,value提交到后台,这样我们就可以少写一个隐藏域。

image按钮这里写不怎么规范,它其实还要一个src属性,指定一个图片,提交时,地址变成这样的:

http://localhost:8383/avalon/newhtml.html?bbb=eee&submit.x=7&submit.y=8&submit=yyy
1 http://localhost:8383/avalon/newhtml.html?bbb=eee&submit.x=7&submit.y=8&submit=yyy

image能提交你当时的点击位置,曾经用来防止机器人刷单刷评论!

如果button标签不指定type值,那么它会默认是submit,其效果与input[type=submit]相同!

reset按钮不会提交,因此没有反应。

此外,总结一下各种提交表单的方式:

点击input[type=submit]
点击input[type=image]
点击button[type=submit]
在文本域或密码域等可以填空的表单元素内回车!
上一篇:浅谈响应式web
下一篇:浅析jQuery基础核心

合肥达内Web培训机构聊一聊web前端开发的行业前景

合肥达内Web前端培训培养软件开发工程师

合肥Web前端培训带给你专业web前端知识

合肥Web培训学校对网站前端性能做相应的优化

选择城市和中心
贵州省

广西省

海南省

台湾