1. 取消按钮按下时的虚线框
在input里添加属性值 hideFocus 或者 HideFocus=true
2. 只读文本框内容
在input里添加属性值 readonly
3. 防止退后清空的TEXT文档(可把style内容做做为类引用)
<INPUT style=behavior:url(#default#savehistory); type=text id=oPersistInput>
4. ENTER键可以让光标移到下一个输入框
<input onkeydown="if(event.keyCode==13) event.keyCode=9" >
5. 只能为中文(有闪动)
<input onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13) event.keyCode=9">
6. 只能为数字(有闪动)
<input onkeyup="value=value.replace(/[^/d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))">
7. 只能为数字(无闪动)
<input style="ime-mode:disabled" onkeydown="if(event.keyCode==13) event.keyCode=9" onKeyPress="if ((event.keyCode<48 event.keyCode>57)) event.returnValue=false">
8. 只能输入英文和数字(有闪动)
<input onkeyup="value=value.replace(/[/W]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))">
9. 屏蔽输入法
<input type="text" name="url" style="ime-mode:disabled" onkeydown="if(event.keyCode==13) event.keyCode=9">
10. 只能输入 数字,小数点,减号(-) 字符(无闪动)
<input onKeyPress="if (event.keyCode!=46 && event.keyCode!=45 && (event.keyCode<48 event.keyCode>57)) event.returnValue=false">
11. 只能输入两位小数,三位小数(有闪动)
<input maxlength=9 onkeyup="if(value.match(/^/d{3}$/)) value=value.replace(value,parseInt(value/10)) ;value=value.replace(//./d*/./g,'.')" onKeyPress="if((event.keyCode<48 event.keyCode>57) && event.keyCode!=46 && event.keyCode!=45 value.match(/^/d{3}$/) //./d{3}$/.test(value)) {event.returnValue=false}" id=text_kfxe name=text_kfxe>
分享到:
相关推荐
### JavaScript网页表单元素Input的高级用法 在Web开发中,`<input>`元素是构建用户交互界面的重要组成部分之一。通过JavaScript可以实现对`<input>`元素的高级操作,从而提升用户体验、增加表单的有效性和安全性。...
### Input高级用法详解 #### 一、概述 在网页开发过程中,`input`元素是与用户交互最为频繁的HTML元素之一。通过合理地利用`input`的各种属性和事件,可以实现更为丰富的用户体验和功能。本文将根据提供的部分代码...
原生JavaScript作为Web开发的基础,提供了丰富的API和方法来处理表单元素,如input和select。本主题将深入探讨如何使用原生JavaScript对form表单进行美化,并对input输入框和select下拉框进行优化。 一、表单基础 1...
### 表单Input的高级用法11例详解 #### 1. 取消按钮按下时的虚线框 在Web开发中,当用户点击取消按钮时,有时希望原本聚焦的`<input>`框不再显示聚焦状态下的虚线边框。这种需求可以通过设置`<input>`元素的属性来...
在网页设计中,表单是收集用户数据的重要工具,尤其在处理动态或不确定的数据量时,如报名系统中不确定的报名人数。本示例聚焦于一个动态增加表单输入的解决方案,允许用户根据需求自由添加新的姓名输入框,以适应...
本章主要聚焦于"表单元素"这一主题,结合源码分析和工具应用,深入探讨如何有效地创建和管理网页表单。 表单元素通常包括输入框(input)、文本区域(textarea)、下拉菜单(select)、复选框(checkbox)、单选...
在现代网页设计中,表单元素的样式设计是至关重要的,因为它们直接影响用户体验。CSS3作为CSS的最新版本,提供了一系列强大的新特性,使得表单输入框(input)的美化变得非常容易且多样化。本资源“14种CSS3炫酷表单...
合理运用标签(label)与输入元素(input)的关联,如使用`<label>`元素或`for`属性,增加可点击区域,提高可用性。 2. **错误提示**:实时验证用户输入,提供明确的错误信息,并指示出具体出错的字段。可以使用...
本文将详细介绍一些`<input>`标签的高级用法及其与JavaScript结合的应用场景。 #### 1. 隐藏焦点效果 通过设置`hideFocus`属性为`true`,可以在用户点击`<input>`框时隐藏其周围的高亮效果。这通常用于改善用户体验...
表单元素包括各种输入控件,如文本框 `<input type="text">`、密码框 `<input type="password">`、复选框 `<input type="checkbox">`、单选按钮 `<input type="radio">`、下拉列表 `<select>`、多行文本框 `...
2. **表单控件增强**:HTML5增加了新的表单元素,如<input type="date">、<input type="range">,以及、和等,提供了更丰富的用户输入体验。 3. **Canvas画布**:HTML5的元素允许动态绘制图形,开发者可以利用...
总的来说,《jQuery高级注册表单》这个项目涵盖了前端开发的多个核心领域,通过学习和实践,开发者不仅能掌握jQuery的高级用法,还能深化对HTML5和CSS的理解,提高构建交互性表单的能力。在这个过程中,开发者会学习...
在`chkform()`函数中,开发者会获取表单元素的值并进行判断,如: ```javascript function chkform() { var uname = document.mainform.username.value; if (uname == "") { alert("啊,你的用户名还没有填写呢...
学生需要掌握表单的概念和定义方法,包括如何使用不同的表单元素标签,如`<input>`、`<textarea>`、`<select>`等。表单元素的应用涵盖文件域(用于上传文件)、隐藏控件(存储不显示给用户的数据)以及表单边框的...
当然,这仅是网页自动操作通用工具强大功能的一部分,实际上还有更多高级的应用场景等待着我们去探索和实践。希望本文能帮助您更好地理解和掌握网页自动填表的基础知识,为您的日常工作带来更多便利。
本例中,通过精心设计的CSS规则,实现了表单元素的动态效果,提高了用户的使用体验。 - **统一元素样式**:定义全局样式以保持页面一致性,例如清除默认边距、设置字体等。 - **特定元素样式**:为表单中的各个元素...
此外,CSS3的Flexbox布局模型和Grid布局模型也使得表单元素的排列和对齐更加灵活。通过设置`display: flex`或`display: grid`,我们可以轻松实现响应式设计,确保表单在不同设备上都能良好显示。 至于"jiaoben1202...
在实际应用中,结合JavaScript可以实现更高级的表单验证和交互。例如,使用`pattern`属性定义正则表达式进行复杂验证,或者通过`required`属性设定必填字段。此外,`placeholder`属性用于提供输入提示,`autofocus`...