更改表单的 action 属性

<html>

<head>

<script type="text/javascript">

function changeAction()

{

var x=document.getElementById("myForm")

alert("Original action: " + x.action)

x.action="/htmldom/index.asp"

alert("New action: " + x.action)

x.submit()

}

</script>

</head>

<body>





<form id="myForm" action="/i/eg_smile.gif">

名称:<input type="text" value="米老鼠" />

<input type="button" onclick="changeAction()"

value="改变 action 属性并提交表单" />

</form>





</body>

</html>

返回向服务器发送数据的 HTTP 方法

提示按钮的 id 和 类型 + 禁用按钮

<html>

<head>

<script type="text/javascript">

function alertId()

{

var txt="Id: " + document.getElementById("myButton").id

txt=txt + ", type: " + document.getElementById("myButton").type

alert(txt)





document.getElementById("myButton").disabled=true

}

</script>

</head>





<body>

<form>

<button id="myButton" onClick="alertId()">请点击我!</button>

</form>

</body>





</html>

选定以及不选定 checkbox

<html>

<head>

<script type="text/javascript">

function check(){

document.getElementById("myCheck").checked=true;

}

function uncheck(){

document.getElementById("myCheck").checked=false;

}

</script>

</head>





<body>

<form>

<input type="checkbox" id="myCheck" />

<input type="button" onclick="check()" value="选定复选框" />

<input type="button" onclick="uncheck()" value="取消选定复选框" />

</form>

</body>





</html>

一个表单中的若干个 checkbox

<html>

<head>

<script type="text/javascript">

function createOrder()

{

coffee=document.forms[0].coffee

var txt=""

for (i=0;i<coffee.length;++ i)

{

if (coffee[i].checked)

{

txt=txt + coffee[i].value + " "

}

}

document.getElementById("order").value="您订购的咖啡带有: " + txt

}

</script>

</head>





<body>

<p>你喜欢怎么喝咖啡?</p>

<form>

<input type="checkbox" name="coffee" value="奶油">加奶油<br />

<input type="checkbox" name="coffee" value="糖块">加糖块<br />

<br />

<input type="button" onclick="createOrder()" value="发送订单">

<br /><br />

<input type="text" id="order" size="100">

</form>

</body>





</html>

Checkbox - 把文本转换为大写

使用单选按钮中的 value 属性

重置表单

提交表单

验证表单

设置和移开文本域上的焦点

选取文本域中的内容

表单中的下拉列表

另一个下拉列表

当达到文本域的最大字符数时跳至下一个域

为若干表单域添加快捷键

Form 和 Input 对象的更多相关文章

  1. 通过表单展示不一样的页面(input对象)

    表单中包含不一样的样式,不同功能的提交数据的方式.在许多页面中,浏览者不经意间已经不断在使用表单的功能,如留言,设置自己的密码或者是复选框,下拉列表等. input对象下的多种表单表现形式: 通常在页 ...

  2. 根据标记清空页面中所有的input对象

    function clear1(flag) { //获取页面中所有的input对象 var inputs = document.getElementsByTagName("input&quo ...

  3. 使用 JavaScript 实现名为 flatten(input) 的函数,可以将传入的 input 对象(Object 或者 Array)进行扁平化处理并返回结果

    请使用 JavaScript 实现名为 flatten(input) 的函数,可以将传入的 input 对象(Object 或者 Array)进行扁平化处理并返回结果.具体效果如下: const in ...

  4. Input对象的type类型

    Input表示Form表单中的一种输入对象,其又随Type类型的不同而分文本输入框,密码输入框,单选/复选框,提交/重置按钮等,下面一一介绍. 1,type=text        输入类型是text ...

  5. js创建form添加input项目并提交表单

    var generateHideElement = function (name, value) { var tempInput = document.createElement("inpu ...

  6. html5 填表 表单 form label input button legend fieldset

      <form>本身没有什么意义, 但是某些依赖form的标签元素一旦没有了form就不能生效. 所以form是提供一个定义环境给form的插件元素去生效的. 1.method 属性pos ...

  7. Input对象2(貌似是独立标签)

    6.hidden隐藏域的样式表单:Hidden属性可以创建一个隐藏域,数据会被隐藏起来,因此用户是无法操作的.这样说来hidden好像没有什么用,事实上,正是出于安全的考虑,在多步操作数据的同时,用h ...

  8. 关于<marquee>、<form>、input中的<text>、<password>、<hidden>、<wenbenkuang>、<reset>、<image>、<submit>、<radio>、<checkbox>以及<select><iframe src>的用法

    <html>    <head>        <meta charset="UTF-8">        <title></ ...

  9. 前端与后台可能需要使用交互的表单form,input标签

    前端与后台可能需要使用交互的表单标签 form表单和input标签 textarea文本域表单 select,option下拉列表表单 fieldset和legend组合表单 label标签 form ...

随机推荐

  1. iOS中 Realm的学习与使用 韩俊强的博客

    每日更新关注:http://weibo.com/hanjunqiang  新浪微博! 有问题或技术交流可以咨询!欢迎加入! 这篇直接搬了一份官方文档过来看的 由于之前没用markdown搞的乱七八糟的 ...

  2. iOS中 最新微信支付/最全的微信支付教程详解 韩俊强的博客

    每日更新关注:http://weibo.com/hanjunqiang  新浪微博! 亲们, 首先让我们来看一下微信支付的流程吧. 1. 注册微信开放平台,创建应用获取appid,appSecret, ...

  3. 【翻译】Ext JS最新技巧——2015-8-11

    原文:Top Support Tips Seth Lemmons:使用棒极了的Awesome Font Ext JS 6附带了一个新的海卫一主题,可以使用Font Awesome字体作为背景图像的图标 ...

  4. IOC 控制反转(Inversion of Control,英文缩写为IoC)

    在采用面向对象方法设计的软件系统中,它的底层实现都是由N个对象组成的,所有的对象通过彼此的合作,最终实现系统的业务逻辑. 在这样的齿轮组中,因为是协同工作,如果有一个齿轮出了问题,就可能会影响到整个齿 ...

  5. UNIX环境高级编程——管道读写规则和pipe Capacity、PIPE_BUF

    一.当没有数据可读时O_NONBLOCK disable:read调用阻塞,即进程暂停执行,一直等到有数据来到为止. O_NONBLOCK enable:read调用返回-1,errno值为EAGAI ...

  6. 关于Class文件

    什么是Class文件 Java人对class文件肯定很熟悉了,它是Java源码编译后的产物.JVM运行时负责加载class文件,并根据class定义的执行逻辑运行.java为了将硬件底层的差异屏蔽掉, ...

  7. 毕加索的艺术——Picasso,一个强大的Android图片下载缓存库,OkHttpUtils的使用,二次封装PicassoUtils实现微信精选

    毕加索的艺术--Picasso,一个强大的Android图片下载缓存库,OkHttpUtils的使用,二次封装PicassoUtils实现微信精选 官网: http://square.github.i ...

  8. React Native控件之Listview

    ListView组件用于显示一个垂直的滚动列表,其中的元素之间结构近似而仅数据不同. ListView更适于长列表数据,且元素个数可以增删.和ScrollView不同的是,ListView并不立即渲染 ...

  9. Oracle生成查询包含指定字段名对应的所有数据表记录语句

    应用场合:已知字段名字,查询数据库中所有数据表中包含该字段名的所有数据表 操作办法:指定字段名,数据库表用户,执行下面查询语句即可 --Oracle生成查询包含指定字段名对应的所有数据表记录语句 de ...

  10. Linux 学习笔记_12_Windows与Linux文件共享服务_1.1_--Samba(下)Samba经典应用案例

    五.[Samba应用案例二] 设置Samba共享目录/software,允许用户jack和mary可以通过Windows客户端访问,并具有读写权限. 1.创建目录/software,添加用户jack, ...