首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

(续)很久很久以前学的,16个HTML笔记

一个表单有三个基本组成部分: 表单标签:这里面包含了处理表单数据以及数据提交到服务器。 表单域:包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。...表单按钮:包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。 ?...target规定 action 属性中地址的目标(默认:_self)。 Action属性: Action属性定义在提交表单时执行的动作。通常表单会被提交到web服务器上的某个PHP文件。...GET适合少量数据的提交。一般使用GET提交时,提交的数据会在地址栏中显示出来。一般搜索查询的时候用GET提交。 何时使用POST?...php $name = $_POST['name']; echo "从11.html中传递过来的姓名为:".$name; 效果展示: ? ?

2.8K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JavaScript 表单处理

    服务器能够处理的字符集 action 接受请求的URL elements 表单中所有控件的集合 enctype 请求的编码类型 length 表单中控件的数量 name 表单的名称 target 用于发送请求和接受响应的窗口名称...', function (evt) { preDef(evt); }); 我们可以可以使用submit()方法来自定义触发submit事件,也就是说,并不一定非要点击submit按钮才能提交。...因为各种原因,当一条数据提交到服务器的时候会出现延迟等长时间没反映,导致用户不停的点击提交,从而使得重复提交了很多相同的请求,或造成错误、或写入数据库多条相同信息。...); }); 有两种方法可以解决这种问题:第一种就是提交之后,立刻禁用点击按钮;第二种就是提交之后取消后续的表单提交操作。...但使用原生的DOM访问虽然比较通用,但不是很便利。表单处理中,我们建议使用HTML DOM,它有自己的elements属性,该属性是表单中所有元素的集合。

    4.8K101

    表单提交中的input、button、submit的区别

    IE浏览器的兼容,请记住button[type]在IE中的默认值是button,这意味着它只是一个按钮而不会引发表单提交。   ...提交表单时,value会被作为表单数据提交给服务器。 在IE中,甚至会把button开始与结束标签之间的内容作为name对应的值提交给服务器。...同时请注意设置type=submit来兼容IE。 3.回车键提交表单 Enter键是可以提交表单的!但是你可能已经注意到了,并非所有的表单都可以用Enter键来提交。...当表单中只有一个单行的文本输入控件时,用户代理应当接受回车键来提交表单。 “单行”指的是type为text而非textarea,显然在textarea中回车提交表单是怎样的难以接受。...其实在实践中,有多个单行的input也可以用Enter提交,比如登录页面。 4.阻止表单提交 阻止表单提交也是一个常见的话题,通常用于客户端的表单验证。

    4.1K100

    firefox中用js提交表单

    用.submit () 方法提交表单 3).button 的 name/id 绝对不能命名为”submit” 4).form 中所有的组件(按钮,文本框等)的 name/id 也不能命名为”submit...” # 当提交按钮的 name 或者 id 为 submit 时候,用 js 提交表单,表单名.submit () 时候会报一个错误,提示对象不支持此属性或办法。...那么,请问为什么 当提交按钮的 name 或者 id 为 submit 或者 action 的时候 js 提交表单会报错呢?这难道是 一个 bug? 高手们请指教。。。。...因为” 表单名.submit () 提交” 这种写法本身就是不符合 W3C 标准的规定的,在 IE 下没有报错因为 IE 支持这种写法,但是如果在 FF 下就会报错,要写成”document.getElementById...我在项目中发现 与 得出的效果截然不同, 谁能告诉我这两着有合不同 我又如何能用图片来替代原有的提交按钮 是说这是一个按钮,它的是一个提交按钮。当点击它时,它会自动将它所在的表单进行提交.

    7.2K20

    C# HTTP系列10 form表单的enctype属性

    系列目录 【已更新最新开发文章,点击查看详细】 在ASP.NET编程中经常遇到下面的代码片段,将人员信息以表单方式提交到后台程序并保存到服务器与数据库中。...)中,但协议并没有规定数据必须 使用什么编码方式。..." name="submit" value="提交"/> 此点击【提交】按钮,Form提交请求数据,Fiddler抓包时看到的请求如下(无关的请求头在本文中都省略掉了): ?...由于 JSON 规范的流行,除了低版本 IE 之外的各大浏览器都原生支持 JSON.stringify,服务端语言也都有处理 JSON 的函数,使用 JSON 不会遇到什么问题。...postman 使用 1、form-data: http请求中的multipart/form-data,它会将表单的数据处理为一条消息,以标签为单元,用分隔符分开。

    1.1K40

    onbeforeunload事件_pageload事件何时触发

    IE浏览器在对话框中显示返回的字符串,但其他浏览器会显示自己的消息。如果未提供任何值,则以静默方式处理事件。...注意:为了防止不需要的弹出窗口,浏览器可能不会显示在beforeunload事件处理程序中创建的提示,除非页面已与之交互,甚至根本不显示它们。...PS:如果进入当前页面后没有用户没有与页面进行任何交互(比如鼠标在页面上点击),直接关掉或者刷新当前页面是没有弹窗提示。...通过input type=”submit”按钮提交一个具有指定action的表单的时候。...使用form.submit() 提交表单的时候 应用场景 onbeforeunload对话框用于现代Web上的两件事: 防止用户无意中丢失数据。 欺骗用户。

    3K20

    谁动了我的Token | TW洞见

    11点了,我们的诊断工作紧张而有序的继续进行着,分析各种可能出现的异常路径以及可能性。各种测试验证貌似都没有问题。“这不应该呀。...我和夏夏又过了一遍Anti-CSRF Token处理代码,做了各种尝试,仍然没有头绪。即使e.preventDefault可以解决问题,但我们仍然不知道问题根源。谁动了我的Token!...看完了推荐的答案很是吐血 -- IE兼容模式。熟悉IE的程序员都知道,这基本可以作为修复IE问题的万能解药。 夏夏说,“我们先来试一下”。修改代码运行系统,叮,问题也被修复了!...这个时候,我们三个都不约而同的看到了下面这篇Stackoverflow的帖子: ? 强哥说,“这好像没关系,他这代码写的不对,Form上的按钮是Submit类型,还绑定Click去提交。”...问题的罪魁祸首就这样找到了,我们通过Git提交历史也知晓了这个问题是在n年前解决“按钮多次点击问题”时引入的。

    83690

    form表单

    form 表单 form表单就是填写的单子:比如登录窗口、编辑资料等 一般用于数据提交到到后端,然后保存 一、form表单的语法 表单非常重要,一般用于数据提交到到后端,然后将数据保存到服务器端 属性 action,表示我们要提交的网址 属性 method...,表示我们提交数据的方式,通常有 get 和 post 两种 GET 提交会将数据通过 & 串成一个字符串提交,这个字符串会显示在浏览器的地址栏中,相对来说不安全,而且有长度的限制 POST 提交是直接将数据提交到服务器...,不会显示到浏览器地址栏中,相对比较安全,而且没有长度限制 属性 enctype:一般的值是 multipart/form-data ,主要是用于文件的流的上传 二、代码实战 新建 html 文件 11...-form.html, 编写下方程序,运行看看效果吧。

    1.4K10

    前端魔法堂:onsubmit和submit事件处理函数怎么不生效呢?

    提交表单的方式 表单仅含一个以下的元素时,该元素得到焦点,按回车键,即可发起表单提交。...,在表单中添加一个input[type=submit]子元素,或在表单外添加一个input[type=submit form=表单ID]的元素,那么当上述元素得到焦点,按回车键,即可发起表单提交。...事件,因此可以在onsubmit函数或submit事件处理函数中禁止执行默认行为来实现表单的异步提交; 方式3既不会调用onsubmit函数,也不会触发submit事件。...首先我们要明确一点的是,验证发生在与input等表单控件发生交互时(输入,点击,脚本修改其值等),而不是提交表单时才触发验证。...然后再根据表单的配置和触发表单提交的方式,决定合法性验证的结果是否会阻止表单的提交。

    1.9K70

    【Web APIs】JavaScript 操作元素 ③ ( 修改表单元素属性 | 表单常用属性 | 表单常用属性修改示例 )

    , 然后可以将这些数据提交到服务器进行处理 ; 2、表单常用属性 HTML 中 表单元素比较特殊 , 有很多属性和样式需要特殊处理 ; 如 : input 输入框 表单 中的内容 , 不能使用 innerHTML...、radio、submit 等 ; name : 定义输入元素的名称 , 用于在提交表单时标识数据 ; 关羽 张飞 disabled : 设置 禁用输入元素 , 禁用的元素在表单提交时不会包含在提交的数据中... 执行结果 : 页面刷新后 , 处于初始状态 , 按钮可点击 , 表单中显示的内容是 " 点击下方按钮 , 改变表单元素内容 " ; 点击 按钮后..., 表单的内容变为 " 按钮被点击 , 表单内容发生改变 " , 按钮也变为不可用状态 ;

    9710

    【Java 进阶篇】深入浅出:JQuery 事件绑定的奇妙世界

    在前端的世界里,事件是不可或缺的一部分。用户的点击、输入、滚动等行为都触发着各种事件,而如何在代码中捕捉并处理这些事件是每位前端开发者必须掌握的技能之一。...表单事件:submit(表单提交)、change(表单元素值改变)、focus(表单元素获得焦点)等。 窗口事件:resize(窗口大小改变)、scroll(滚动条滚动)等。...", function(event) { // 阻止表单提交 event.preventDefault(); // 进行表单提交前的其他操作...alert("表单验证通过,可以提交!")...在表单提交时,通过 submit 事件阻止默认的提交行为,执行其他操作(比如异步验证、数据提交等)。 结语:奇妙世界的探索 通过本文的学习,我们深入了解了 JQuery 事件绑定的基本原理和用法。

    18810

    【HTML5】HTML5 新增 input 表单属性 ( required 属性 | placeholder 属性 | autofocus 属性 | autocomplete 属性 )

    , 可以 选择多个文件提交 ; autofocus 属性 : 属性值为 autofocus , 设置了该属性 , 可以自动进行聚焦 , 页面加载完毕后 , 自动聚焦到设置了该属性的表单 ; autocomplete...需要满足以下两个条件 : 为表单添加 name 属性 自动补全的内容需要之前提交成功过 1、required 属性 required 属性 : 属性值为 required , 一旦设置了该属性 ,..."> submit" value="提交"> 不管在表单内输入什么内容 , 空的内容也能提交 ; 如果为表单设置了 required="required...: 为表单添加 name 属性 自动补全的内容需要之前提交成功过 该属性大部分情况下都要设置为 off , 涉及到隐私 ; 代码示例 : 提交"> 显示效果 : 在 file 表单中 , 点击 选择文件 按钮 , 可以在弹出的对话框中 , 一次性选择多个文件 ;

    3.1K30

    【融职培训】Web前端学习 第5章 node基础教程7 模板引擎概述

    模板引擎可以解决这个问题,通过模板引擎,可以直接设置响应的html页面,并且可以把后台数据绑定到模板中,然后发送给客户端。...}) 12 }); 五、处理表单数据 表单概述 在网页重构的课程中,我们已经了解了表单的基本样式,本节我们讲解如何通过表单向后台发送数据,首先看两个form标签的属性。...action属性:指定表单提交数据的路径 method属性:指定表单提交数据的请求方法,请求方法包括get、post。...form标签设置完成之后,要对表单空间进行设置 input.name属性:指定数据传输的字段 input.type=“submit”:指定提交按钮,点击后提交表单数据 获取get请求的数据 直接通过ctx.query...') 8 const app = new Koa(); 9 app.use(parser()); 10 //获取post请求的参数 11 router.get("/form", async ctx

    42510

    Web前端学习 第5章 node基础教程7 模板引擎概述

    模板引擎可以解决这个问题,通过模板引擎,可以直接设置响应的html页面,并且可以把后台数据绑定到模板中,然后发送给客户端。...}) 12 }); 五、处理表单数据 表单概述 在网页重构的课程中,我们已经了解了表单的基本样式,本节我们讲解如何通过表单向后台发送数据,首先看两个form标签的属性。...action属性:指定表单提交数据的路径 method属性:指定表单提交数据的请求方法,请求方法包括get、post。...form标签设置完成之后,要对表单空间进行设置 input.name属性:指定数据传输的字段 input.type=“submit”:指定提交按钮,点击后提交表单数据 获取get请求的数据 直接通过ctx.query...') 8 const app = new Koa(); 9 app.use(parser()); 10 //获取post请求的参数 11 router.get("/form", async ctx

    56030

    Layui前端框架中的Button添加Click事件

    "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"。...和w3c,firefox浏览器区别: 当在IE浏览器下面时,button标签按钮,input标签type属性为button的按钮是一样的功能,不会对表单进行任何操作。...但是在W3C浏览器,如Firefox下就需要注意了,button标签按钮会提交表单,而input标签type属性为button不会对表单进行任何操作。...这里的点击事件是指单纯的点击事件,而不是提交事件,或者是数据表格中内嵌的button,对于这两者,layui是有lay-submit和lay-event这个属性进行支持的,所以这里只能使用最原始的js和...所以在做负载等要求不那么严格的“小程序”,从维护的角度上,建议用jQuery绑定,简单清楚,最容易维护。

    5.7K20

    表单脚本

    下述内存主要讲述了《JavaScript高级程序设计(第3版)》第14章关于“表单脚本”。 刚开始人们使用JavaScript,最主要的目的之一就是表单的验证,分担服务器处理表单的责任。...提交表单 (1)提交按钮提交 方式1:通用提交按钮 submit" value="Submit Form" /> 方式2:自定义提交按钮 submit...(textarea除外,在文本区中回车会换行)。如果表单没有提交按钮,安回车键不会提交表单。 注意,通过上述方式提交表单,浏览器会在将请求发送给服务器之前触发submit事件。...提交表单过程中有可能发生的最大问题就是,重复提交表单。 解决方式: (1)第一次提交表单后就禁用提交按钮。 要在“submit”事件处理函数中处理,不能在“click”事件处理函数中处理。...因为有的浏览器会在click事件触发前,触发submit事件! (2)利用onsubmit事件处理程序取消后续的表单提交方式。

    4.8K41
    领券